AngularJS Hizmet

AngularJS'te kendi hizmetlerinizi oluşturabilir veya çok sayıda yerleşik hizmetten birini kullanabilirsiniz.

Hizmet nedir?

AngularJS'te, hizmetler fonksiyonlar veya nesnelerdir ve sadece AngularJS uygulamanızda kullanılabilirler.

AngularJS yaklaşık 30 adet yerleşik hizmete sahiptir. Bunlardan biri $location hizmeti.

$location Hizmet, mevcut web sayfası konumuna dair bilgiler döndürebilen yöntemlere sahiptir:

Örnek

Kontrolörde $location hizmetini kullanma:

var app = angular.module('myApp', []);
app.controller('customersCtrl', function($scope, $location) {
    $scope.myUrl = $location.absUrl();
});

Kişisel Olarak Deneyin

Lütfen dikkat edin:$location Hizmet, kontrolörüne parametre olarak geçirilir. Kontrolörde hizmet kullanmak için, onu bağımlılık olarak tanımlamak zorundasınız.

Neden hizmet kullanılır?

birçok hizmet için, örneğin $location hizmeti, DOM'da mevcut olan nesneleri (örneğin window.location nesnesi), ancak bazı sınırlamalar olacak, en azından AngularJS uygulamanız için böyle.

AngularJS sürekli olarak uygulamanızı izler, değişiklikleri ve olayları doğru bir şekilde işlemesi için AngularJS, sizin $location hizmet yerine window.location nesnesi.

$http hizmeti

$http Hizmet, AngularJS uygulamasında en sık kullanılan hizmetlerden biri. Hizmet sunucuya istek gönderir ve uygulamanızın yanıtları işleme koymasını sağlar。

Örnek

Sunucudan veri talep etmek için $http hizmetini kullanın:

var app = angular.module('myApp', []);
app.controller('myCtrl', function($scope, $http) {
  $http.get("welcome.htm").then(function (response) {
    $scope.myWelcome = response.data;
  });
});

Kişisel Olarak Deneyin

Bu örnek $http 服务的非常简单的用法。AngularJS Http eğitiminde $http hizmeti hakkında daha fazla bilgi edinin。

$timeout hizmeti

$timeout Hizmet AngularJS sürümünün window.setTimeout fonksiyonu.

Örnek

İki saniye sonra yeni bir mesaj gösterin:

var app = angular.module('myApp', []);
app.controller('myCtrl', function($scope, $timeout) {
  $scope.myHeader = "Hello World!";
  $timeout(function () {
    $scope.myHeader = "How are you today?";
  }, 2000);
});

Kişisel Olarak Deneyin

$interval hizmeti

$interval Hizmet AngularJS sürümünün window.setInterval fonksiyonu.

Örnek

Her saniye zamanı gösterin:

var app = angular.module('myApp', []);
app.controller('myCtrl', function($scope, $interval) {
  $scope.theTime = new Date().toLocaleTimeString();
  $interval(function () {
    $scope.theTime = new Date().toLocaleTimeString();
  }, 1000);
});

Kişisel Olarak Deneyin

Kendi hizmetinizi oluşturun

Kendi hizmetinizi oluşturmak için hizmeti modüle bağlayın:

Adı hexafy hizmeti:

app.service('hexafy', function() {
  this.myFunc = function (x) {
    return x.toString(16);
  }
});

Kendi özelleştirilmiş hizmetinizi kullanmak için kontrolör tanımlarken ona bağımlılık ekleyin:

Örnek

Hexafy adında özelleştirilmiş hizmeti kullanarak sayıyı onaltılık sayıya dönüştürün:

app.controller('myCtrl', function($scope, hexafy) {
  $scope.hex = hexafy.myFunc(255);
});

Kişisel Olarak Deneyin

Filtrelerde Özel Hizmet Kullanımı

Hizmeti oluşturduktan ve uygulamaya bağladıktan sonra, herhangi bir kontrolör, yönerge, filtre veya hatta diğer hizmetlerde bu hizmeti kullanabilirsiniz.

Hizmeti filtre tanımlarken bağımlılık olarak eklemek için:

Filtre myFormat'ta kullanılan hizmet hexafy:

app.filter('myFormat',['hexafy', function(hexafy) {
  return function(x) {
    return hexafy.myFunc(x);
  };
});

Kişisel Olarak Deneyin

Bu filtresi, değerleri görüntülerken kullanabilirsiniz:

<ul>
  <li ng-repeat="x in counts">{{x | myFormat}}</li>
</ul>

Kişisel Olarak Deneyin