a

ABLY مقالات و مطالب مجموعه

دوره آموزشی AngularJS به زبان فارسی - بخش نوزدهم

دوره آموزشی AngularJS به زبان فارسی - بخش نوزدهم

بسم الله الرحمن الرحیم

 

این دوره آموزشی تا بخش بیست و دوم مقدماتی خواهد بود اگر به این مطالب تسلط دارید لطفا به آموزش "طراحی یک Single Page Application با ASP.NET Web API و  Angular.js " مراجعه کنید.

 

مشاهده تمامی آموزش های دوره AngularJS

آموزش AngularJS

بخش نوزدهم

 

AngularJS Services


AngularJS به وسیله معماری سرویس از مفهوم جدا سازی ارتباطات پشتیبانی می کند. سرویس ها توابع javascript ایی هستند که فقط برای پاسخ گویی به کارهای خاص مورد استفاده قرار می گیرند. این باعث می شود کارها به صورت

 

 

بسم الله الرحمن الرحیم

 

این دوره آموزشی تا بخش بیست و دوم مقدماتی خواهد بود اگر به این مطالب تسلط دارید لطفا به آموزش "طراحی یک Single Page Application با ASP.NET Web API و  Angular.js " مراجعه کنید.

 

مشاهده تمامی آموزش های دوره AngularJS

آموزش AngularJS

بخش نوزدهم

 

AngularJS Services


AngularJS به وسیله معماری سرویس از مفهوم جدا سازی ارتباطات پشتیبانی می کند. سرویس ها توابع javascript ایی هستند که فقط برای پاسخ گویی به کارهای خاص مورد استفاده قرار می گیرند. این باعث می شود کارها به صورت موجودیت های جدا در نظر گرفته شوند و که این همان قابلیت تست و نگه داری است (maintainable و testable). کنترلر ها و فیلتر ها می توانند در صورت نیاز سرویس ها را فراخوانی کنند. سرویس معمولا توسط معماری تزریق وابستگی (dependency injection) AngularJS در بخش های مختلف تزریق می شوند.
AngularJS برخی از سرویس های داخلی از پیش تعریف شده مانند $http, $route, $window, $location و غیره را برای ما فراهم می کند. هر سرویس برای یک کار خاص قابل پاسخگویی است. $http برای دریافت اطلاعات به صورت ajax مورد استفاده قرار می گیرد. $route برای مسیریابی اطلاعات و کارهای مشابه آن مورد استفاده قرار می گیرد.
یادتان باشد سرویس های داخلی از پیش تعریف شده AngularJS با علامت $ شروع می شوند. دو راه برای ساخت سرویس وجود دارد.
•    factory
•    service

 

استفاده از متد factory

در استفاده از متد factory، در ابتدا ما متد factory را تعریف می کنیم و سپس متد خود را آن را به انتقال می دهیم.
 

 

    var mainApp = angular.module("mainApp", []);
      mainApp.factory('MathService', function() {     
         var factory = {};  
         factory.multiply = function(a, b) {
            return a * b 
         }
         return factory;
      }); 

 

استفاده از متد سرویس

در استفاده از متد سرویس، در ابتدا ما متد سرویس را تعریف می کنیم و سپس متد خود را آن را به انتقال می دهیم. همچنین ما می توانیم سرویس هایی را که قبلا تعریف کرده ایم به سرویس فعلی خود انتصاب دهیم.
 

mainApp.service('CalcService', function(MathService){
    this.square = function(a) { 
        return MathService.multiply(a,a); 
    }
});


مثال

در مثال زیر تمام مواردی که در بالا معرفی شده اند، بیان شده اند.

 

<html>
<head>
   <title>Angular JS Forms</title>
</head>
<body>
   <h2>AngularJS Sample Application</h2>
   <div ng-app="mainApp" ng-controller="CalcController">
      <p>Enter a number: <input type="number" ng-model="number" />
      <button ng-click="square()">X<sup>2</sup></button>
      <p>Result: {{result}}</p>
   </div>
   <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.2.15/angular.min.js"></script>
   <script>
      var mainApp = angular.module("mainApp", []);
      mainApp.factory('MathService', function() {     
         var factory = {};  
         factory.multiply = function(a, b) {
            return a * b 
         }
         return factory;
      }); 

      mainApp.service('CalcService', function(MathService){
            this.square = function(a) { 
            return MathService.multiply(a,a); 
         }
      });

      mainApp.controller('CalcController', function($scope, CalcService) {
            $scope.square = function() {
            $scope.result = CalcService.square($scope.number);
         }
      });
   </script>
</body>
</html>

 

کد بالا را ذخیره و اجرا کنید.

 

 

تفاوت متد factory و Service


Factory به شما اجازه می دهد منطق خود را قبل از ایجاد ساخت اشیاء پیاده سازی کنید و Service با استفاده از کلمه new به شما اجازه می دهد اشیایی از سرویس خود ایجاد کنید و به وسیله this به سرویس خود می توانید property اضافه کنید.

 

تفاوت متد factory و Service

 

در این جا نیز یک مثال وجود دارد که می توانید از آن نیز برای درک بهتر موضوع استفاده کنید.

 

مثال تفاوت متد factory و Service

 

مشاهده تمامی آموزش های دوره AngularJS

نظرات

  • Hannah Martinez
    یی
    دو شنبه 11 دی 1278 0:00

    با عرض سلام

  • Hannah Martinez
    علی میلادیان
    دو شنبه 11 دی 1278 0:00

    سلام آقای شیدایی ممنون از شما 

    میشه تفاوت سرویس و factory  را بگید و زمان استفاده هر کدومش

    ممنون

    • Judith Bell
      پاسخ
      حسینبهزادی
      دو شنبه 11 دی 1278 0:00

      با عرض سلام

      در مقاله بخشی را برای مقایسه service و factory اضافه کردم که می توانید آن را مطالعه کنید.

      موفق باشید

نظرات یا سوالات خودرا با ما درمیان بگذارید

0912 097 5516 :Phone Number
0713 625 1757 :Phone Number