10_AngularJs_Service_Factory

Merhaba arkadaşlar, bu yazımda AngularJS de Service ve Factory kavramlarını anlatacağım.

AngularJS Service?

Ortak kullanmak istediğimiz metotlara ve nesnelere erişebilmemizi sağlar. Serviceler new anahtar kelimesi ile oluşturabileceğimiz nesneleri oluştururlar. Bu nedenle Service de olan herşeye “this” anahtar sözcüğü ile erişilebilir.

AngularJS Factory?

Bir Factory kullanırken, bir nesne oluşturursunuz, ona özellikler ekler ve ardından aynı nesneyi döndürürsünüz. Bu Service’i Controller’a geçirdiğimizde nesne üzerindeki bu özellikler artık Controllerdan Factory aracılığı ile mevcut olacaktır.

Factory Ve Service Arasındaki Fark?

Service ve Factory aslında birbirlerine benzerdirler. Factory statik ve tüm uygulamada tek bir nesne oluşturularak kullanılabilir fakat service her seferinde new ile yeni bir nesne oluşturulup kullanılır. Factory aslında Singleton servis nesnesi üreten, primitive tipler, metotlar ve nesneler döndüren yapıdır.

Şimdi örnek üzerinde inceleyelim.

İndex.html

XHTML
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
<html>
<head>
  <script type="text/javascript" src="../resources/js/angular.min.js"></script>
  <script type="text/javascript" src="app.js"></script>
  <link rel="stylesheet" href="../resources/css/bootstrap.min.css">
</head>
<body ng-app="App">
  <div class="container" ng-controller="AppController">
    <div class="row">
      <table>
        <tr>
          <td>
            Sayı:
          </td>
          <td>
            <input type="number" name="num" ng-model="number" class="form-control">
          </td>
        </tr>
        <tr>
          <td>
            <button type="button" name="button" ng-click="square()" class="btn btn-primary">Tıkla</button>
          </td>
        </tr>
        <tr>
          <td>
            <h4>{{sonuc}}</h4>
          </td>
        </tr>
      </table>
    </div>
  </div>
</body>
</html>

App.js

JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
var app = angular.module('App', []);
 
app.factory('TestFactory', function() {
  var factory = {};
  factory.hesapla = function(a, b) {
    return a * b;
  }
  return factory;
});
 
app.service('DenemeService', function(TestFactory) {
  this.square = function(a) {
    return TestFactory.hesapla(a, a, );
  }
});
 
app.controller('AppController', ['$scope', 'DenemeService', function($scope, DenemeService) {
  $scope.square = function() {
    $scope.sonuc = DenemeService.square($scope.number);
  }
}]);

Bu yazımı burada bitiriyorum. Diğer yazılarımda görüşmek üzere…

Print Friendly, PDF & Email

Bir cevap yazın

E-posta hesabınız yayımlanmayacak.