AngularJS Servis nedir?

2

AngularJS Servis nedir? AngularJS Servis nasıl kullanılır?

alattin alattin (14806)
3 yıl önce sordu

    Toplam 1 Cevap


    3

    AngularJS Servis nedir? AngularJS Servis nasıl kullanılır?

    AngularJS'de servis, belirli görevleri yerine getiren fonksiyonları ifade eder. AngularJS ile kendi servislerinizi oluşturabileceğiniz gibi, bütünleşik gelen servislerden de faydalanabilirsiniz. $http, $route, $window, $location gibi servisler bunlardan bir kaçıdır.

    Her servis belirli bi görevden sorumludur. Örneğin $http sunucuya ajax isteği yollayarak veri çekmeye yarar. Tüm bütünleşik hizmetler $ sembolü ile başlar.

    AngularJS ile servisi iki şekilde yaratabilirsiniz:

    • factory
    • services

    Kodun nasıl çalıştığını gör

    <html lang="en">
    <head>
        <meta charset="utf-8" />
        <title></title>
        <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.7/angular.min.js"></script>
    </head>
    <body ng-app="app">   
        <div ng-controller="islem">
            <input type="text" ng-model="sayi1" /> <input type="text" ng-model="sayi2" />
            <p>
                <button ng-click="carp()">Carp</button>
                <button ng-click="topla()">Topla</button>
            </p>
            <p>
                sonuc : {{sonuc}}
            </p>
        </div>
        <hr />
        <div ng-controller="hesaplama">
            <input type="text" ng-model="sayi1" /> <input type="text" ng-model="sayi2" />
            <p>
                <button ng-click="cikartma()">Çıkart</button>
                
            </p>
            <p>
                sonuc : {{sonuc}}
            </p>
        </div>
        <script>
            var app = angular.module('app', []);
            app.factory('MatematikServisi', function () {
                var factory = {};
                factory.carpma = function (a, b) {
                    return a * b;
                }
                factory.toplama = function (a, b) {
                    return parseInt(a) + parseInt(b);
                }
                factory.cikartma = function (a, b) {
                    return parseInt(a) - parseInt(b);
                };
                return factory;
            });
            app.service('HesaplamaServisi', function (MatematikServisi) {
                this.cikartma = function (a,b) {
                    return MatematikServisi.cikartma(a,b);
                };
    
            });
            app.controller('islem', function ($scope, MatematikServisi) {
                $scope.carp = function () {
                    $scope.sonuc = MatematikServisi.carpma($scope.sayi1, $scope.sayi2);
                }
                $scope.topla = function () {
                    $scope.sonuc = MatematikServisi.toplama($scope.sayi1, $scope.sayi2);
                }
            })
            app.controller('hesaplama', function ($scope, HesaplamaServisi) {
                $scope.cikartma = function () {
                    $scope.sonuc = HesaplamaServisi.cikartma($scope.sayi1, $scope.sayi2);
                }
            })
        </script>    
    
    </body>
    </html>

     

    Yukarıdaki örnekte iki adet servis oluşturuluyor: MatematikServisi ve HesaplamaServisi . Bu servisler factory ve service metodları ile oluşturuluyor.

    Daha sonra bu servisler Controller tarafından kullanılıyor. Bu örnekte Controller tarafından kullanılan servislerin View tarafınan nasıl kullanıldığını görebilirsiniz.

    ng-click AngularJS özelliği ile Controller içindeki metot tetikleniyor. Servislerin Controller tarafından kullanıldığına dikkat edin. 

    alattin alattin (14806)
    3 yıl önce cevaplandı

      üyelik gerektirir

      Cevap yazabilmek için üye girişi yapmalısınız.

      Eğer uzmanim.net üyesiyseniz giriş yapabilirsiniz: üye girişi yap
      uzmanim.net'e üye olmak çok kolaydır: hemen kayıt ol