AngularJS Hizmetleri
AngularJS'de kendi hizmetinizi oluşturabilir veya birçok yerleşik hizmetten birini kullanabilirsiniz.
Hizmet Nedir?
AngularJS'de hizmet, AngularJS uygulamanız için kullanılabilen ve bununla sınırlı olan bir işlev veya nesnedir.
AngularJS'nin yaklaşık 30 yerleşik hizmeti vardır. Bunlardan biri $location
hizmettir.
Hizmet $location, geçerli web sayfasının konumu hakkında bilgi veren yöntemlere sahiptir:
Örnek
$locationHizmeti bir denetleyicide kullanın :
var app = angular.module('myApp', []);
app.controller('customersCtrl',
function($scope, $location) {
$scope.myUrl = $location.absUrl();
});
$locationHizmetin denetleyiciye bir argüman olarak iletildiğini unutmayın . Servisin controller içerisinde kullanılabilmesi için bir bağımlılık olarak tanımlanması gerekir.
Hizmetler neden kullanılır?
Hizmet gibi birçok hizmet için, $locationnesne gibi zaten DOM'da bulunan nesneleri kullanabileceğiniz görülüyor window.location
ve bunu yapabilirsiniz, ancak en azından AngularJS uygulamanız için bazı sınırlamaları olacaktır.
AngularJS, uygulamanızı sürekli olarak denetler ve değişiklikleri ve olayları düzgün bir şekilde işlemesi için AngularJS , nesne $location
yerine hizmeti kullanmanızı tercih eder.window.location
$http Hizmeti
Servis $http, AngularJS uygulamalarında en yaygın kullanılan servislerden biridir. Hizmet, sunucuya bir istekte bulunur ve uygulamanızın yanıtı işlemesine izin verir.
Örnek
$httpSunucudan veri istemek için hizmeti kullanın :
var app = angular.module('myApp', []);
app.controller('myCtrl',
function($scope, $http) {
$http.get("welcome.htm").then(function
(response) {
$scope.myWelcome
= response.data;
});
});
Bu örnek, hizmetin çok basit bir kullanımını göstermektedir $http. AngularJS Http Eğitiminde$http hizmet hakkında daha fazla bilgi edinin .
$zaman aşımı Hizmeti
Hizmet , işlevin $timeoutAngularJS' versiyonudur .
window.setTimeout
Örnek
İki saniye sonra yeni bir mesaj görüntüleyin:
var app = angular.module('myApp', []);
app.controller('myCtrl',
function($scope, $timeout) {
$scope.myHeader = "Hello
World!";
$timeout(function () {
$scope.myHeader = "How are you today?";
}, 2000);
});
$aralık Hizmeti
Hizmet , işlevin $intervalAngularJS' versiyonudur .
window.setInterval
Örnek
Her saniye zamanı göster:
var app = angular.module('myApp', []);
app.controller('myCtrl',
function($scope, $interval) {
$scope.theTime = new
Date().toLocaleTimeString();
$interval(function () {
$scope.theTime = new Date().toLocaleTimeString();
},
1000);
});
Kendi Hizmetinizi Oluşturun
Kendi hizmetinizi oluşturmak için hizmetinizi modüle bağlayın:
Adlı bir hizmet oluşturun hexafy:
app.service('hexafy', function() {
this.myFunc = function (x) {
return x.toString(16);
}
});
Özel yapım hizmetinizi kullanmak için, denetleyiciyi tanımlarken bunu bir bağımlılık olarak ekleyin:
Örnek
hexafyBir sayıyı onaltılık sayıya dönüştürmek için adlı özel yapım hizmeti kullanın :
app.controller('myCtrl', function($scope, hexafy) {
$scope.hex
= hexafy.myFunc(255);
});
Filtre İçinde Özel Hizmet Kullanın
Bir hizmet oluşturup uygulamanıza bağladıktan sonra, hizmeti herhangi bir denetleyicide, yönergede, filtrede ve hatta diğer hizmetlerin içinde kullanabilirsiniz.
Hizmeti bir filtre içinde kullanmak için, filtreyi tanımlarken bunu bir bağımlılık olarak ekleyin:
hexafyFiltrede kullanılan servis myFormat:
app.filter('myFormat',['hexafy', function(hexafy) {
return function(x) {
return
hexafy.myFunc(x);
};
}]);
Bir nesneden veya bir diziden değerleri görüntülerken filtreyi kullanabilirsiniz:
<ul>
<li ng-repeat="x in counts">{{x | myFormat}}</li>
</ul>