2. 程式人生 > >AngularJs:Service、Factory、Provider依賴注入使用與區別

AngularJs:Service、Factory、Provider依賴注入使用與區別

阿新 • • 發佈：2019-01-15

用有過Spring的人都知道，Spring的核心思想就是DI(依賴注入,Dependency Injection)和IOC(控制反轉 Invension of Controller),AngularJS的service其實就是用到了這裡的DI思想，那麼什麼叫做DI?所謂DI，就是指物件是被動接受依賴類而不是自己主動去找，換句話說就是指物件不是從容器中查詢它依賴的類，而是在容器例項化物件的時候主動將它依賴的類注入給它。我個人的理解就是，你在例項化一個類時，它會自動去例項化它裡面所用到的其它例項。所以這就叫依賴注入。在Angular裡面，services作為單例物件在需要到的時候被建立，只有在應用生命週期結束的時候（關閉瀏覽器）才會被清除。而controllers在不需要的時候就會被銷燬了。

       AngualrJs中可用來注入的有三種類型，service、factory、provider,這三種寫法不樣，用法也都不一樣。其中，service只例項化一次，其實就是單例模式的思想。無論我們在什麼地方注入我們的service，將永遠使用同一個例項。所以對很多在controller層中的操作就可以放到serivce層中去。AngularJS提供例如許多內在的服務，如：$http, $route, $window, $location等。每個服務負責例如一個特定的任務，$http是用來建立AJAX呼叫，以獲得伺服器的資料。 $route用來定義路由資訊等。內建的服務總是字首$符號。

      其中，三者的關係可以看成是下圖：


一、Service使用詳解

（1）定義

一個學用的service用法如下：

一般直接用this來操作資料、定義函式。

  1. app.service('myService', function() {  
  2.     var privateValue = "I am Private";  
  3.     this.variable = "This is public";  
  4.     this.getPrivate = function() { return privateValue;  
  5. };  
  6. });  

（2）AngularJS中使用DI新增Service的三種方法 
方式1（內聯註解，推薦使用）：

  1. app.controller('myController', ['$scope', 'dateFilter', function ($scope, dateFilter) { }]);  
方式2（$inject註解）：
  1.  var MyController = function($scope, dateFilter) {}  
  2. MyController.$inject = ['$scope', 'dateFilter'];  
  3. someModule.controller('MyController', MyController);  
方式3（隱式註解，不推薦使用）：
  1. app.controller('myController', function ($scope, dateFilter) { });  
推薦使用方式1的理由是：
寫法上比方法2更簡單明瞭
比方法3更可靠（由於Javascript可以被壓縮，AngularJS又是通過解析服務名稱找到對應Service的，因此Javascript壓縮之後AngularJS將無法找到指定的Service，但字串不會被壓縮，因此單獨以字串指定Service的名稱可以避免這個問題）
使用方式1或方式2的注意點：
由於上述第二點原因，AngularJS在編譯Html時，由$injector將陣列中Service的名稱與方法體中的Service進行一一對映。這種對映關係必須遵守由AngularJS的約定：
陣列中Service名稱的個數必須與方法體中Service名稱的個數一致
陣列中Service的順序必須與方法體中Serivce的順序一致

（3）什麼時候適合使用service()方法
service()方法很適合使用在功能控制比較多的service裡面
注意：需要使用.config()來配置service的時候不能使用service()方法

（4）service使用例項 

一個完整例項：

  1. <!DOCTYPE html>
  2. <htmllang="zh"ng-app="myApp">
  3. <head>
  4.     <metacharset="UTF-8">
  5.     <title>AngularJS學習</title>
  6.     <scripttype="text/javascript"src="./1.5.3/angular.min.js"></script>
  7. </head>
  8. <body>
  9.     <divng-controller="myCtrl">
  10.         <buttonng-click="getPrivate()">按鈕一</button>
  11.         <buttonng-click="getPUbluc()">按鈕二</button>
  12.     </div>
  13.     <divng-controller = "myCtrl2">
  14.     </div>
  15. </body>
  16. <scripttype="text/javascript">
  17. var app = angular.module('myApp', []);  
  18. app.controller('myCtrl', function($scope, myService) {  
  19.     $scope.getPrivate = function() {  
  20.         alert(myService.getPrivate());  
  21.     };  
  22.     $scope.getPUbluc = function() {  
  23.         alert(myService.variable);  
  24.     };  
  25. });  
  26. app.controller('myCtrl2', function($scope, myService) {  
  27. });  
  28. app.service('myService', function() {  
  29.      console.log('instance myService');  
  30.     var privateValue = "I am Private";  
  31.     this.variable = "This is public";  
  32.     this.getPrivate = function() {  
  33.         return privateValue;  
  34.     };  
  35. });  
  36. </script>
  37. </html>
效果如下：

另外，從這裡可以看到兩個controller注入同一個service，但是最終只例項化了一次！
注意：seivce定義的服務不能在.config中使用！只有provider定義的才可以

二、Factory使用詳解

Factory 一般就是建立一個物件，然後在對這個物件新增方法與資料，最後將些物件返回即可。然後注入到Controller層中即可。 使用例項：
  1. <!DOCTYPE html>
  2. <htmllang="zh"ng-app="myApp">
  3. <head>
  4.     <metacharset="UTF-8">
  5.     <title>AngularJS學習</title>
  6.     <scripttype="text/javascript"src="./1.5.3/angular.min.js"></script>
  7. </head>
  8. <body>
  9.     <divng-controller="myCtrl">
  10.         <buttonng-click="getPrivate()">按鈕一</button>
  11.         <buttonng-click="getPUbluc()">按鈕二</button>
  12.     </div>
  13.     <divng-controller = "myCtrl2">
  14.     </div>
  15. </body>
  16. <scripttype="text/javascript">

  17. 相關推薦

    AngularJs:Service、Factory、Provider依賴注入使用與區別

    用有過Spring的人都知道，Spring的核心思想就是DI(依賴注入,Dependency Injection)和IOC(控制反轉 Invension of Controller),AngularJS的service其實就是用到了這裡的DI思想，那麼什麼叫做DI?所

    Spring學習第一章、第二節：依賴注入（包括自動裝配，物件的注入）

    依賴注入 前言 Spring Bean 定義繼承 Bean 定義模板 正文 Spring依賴注入 基於構造器的依賴注入 基於Setter方法的依賴注入 自

    Spring原始碼解析-5、IOC容器的依賴注入

    IOC容器的初始化過程有沒有注入依賴 IOC容器的初始化過程： 1、BeanDefinition的Resource資源定位 2、BeanDefinition的載入與解析 3、BeanDefinition的註冊 這三個操作至始至終不存在Bean依賴注入。 因此： IOC容器的初始化過程不存

    .Net框架搭建之2、SQL Server MEF依賴注入 MVC Repository框架

    MEF依賴注入簡介 依賴注入對於開發人員來說，方便的就是不需要去關注具體的實現類，不需要去New例項物件，直接使用介面層就能讓程式自動注入使用，當然，還有其他一些特點，比如web http同一個請求中可以設定同一個物件只例項化一次解決多個類中多次例項化物件浪費

    AngularJS中service，factory，provider的區別

    angular原理 ：執行在JavaScript context環境下 通過佇列watch列表 監聽變數 ,APPLY 放入事件佇列中，digest去輪訓列表 .control 初始化scope和增加方法 .service 理解為MVC結構中的M層，來處

    幾種常見設計模式在專案中的應用<Singleton、Factory、Strategy>

    一、前言 　　前幾天閱讀一框架文件，裡面有一段這樣的描述 “從物件工廠中………” ，促使寫下本文。儘管一些模式簡單和簡單，但是常用、有用。 　　結合最近一個專案場景回顧一下里面應用到的一些模式<Singleton、Factory、Strategy>。 　　示例程式碼：https://github.

    【轉載】編譯型語言、解釋型語言、靜態類型語言、動態類型語言概念與區別

    自己 運行 是把 修改 lin 鏈接 時代 dll 系統 編譯型語言和解釋型語言 1、編譯型語言 需通過編譯器（compiler）將源代碼編譯成機器碼，之後才能執行的語言。一般需經過編譯（compile）、鏈接（linker）這兩個步驟。編譯是把源代碼編譯成機器碼，鏈接是把

    編譯型語言、解釋型語言、靜態類型語言、動態類型語言概念與區別

    lan 而是 med 每次 部署 展開 不能 -c 進行 今天看到篇對於靜態、動態、強類型、弱類型總結的很到位的一篇博文，在此Mark下。 編譯型語言和解釋型語言 1、編譯型語言 需通過編譯器（compiler）將源代碼編譯成機器碼，之後才能執行的語言。一般需經過編譯（co

    usb2.0、usb3.0、usb3.1、type-c 接口含義與區別

    區別 wikipedia baidu 分享 3.0 沒有 速度 ID 外觀 簡單說： usb3.0比2.0的傳輸速率快，充電快，能向下兼容2.0 usb3.1比2.0的傳輸速率更快、充電更快，同兼容 先看下usb2.0接口 usb2.0 理論傳輸速率4

    反捲積、上取樣、上池化的聯絡與區別

    FCN於反捲積(Deconvolution)、上取樣(UpSampling) https://blog.csdn.net/nijiayan123/article/details/79416764 反捲積(Deconvolution)、上取樣(UNSampling)與上池化(UnPooling

    spring、springMvc、springBoot和springCloud的聯絡與區別

    spring和springMvc： 1. spring是一個一站式的輕量級的java開發框架，核心是控制反轉（IOC）和麵向切面（AOP），針對於開發的WEB層(springMvc)、業務層(Ioc)、持久層(jdbcTemplate)等都提供了多種配置解決方案； 2. springMv

    依賴注入與Bean的裝配

    依賴注入有三種：setter注入；構造器注入；介面注入(基本不用)。其中setter注入應用最廣泛。 即為Bean中的屬性設定值（強行解釋） Bean的裝配也有三種：XML中顯示配置；在Java的介面和類中實現配置；隱式Bean的發現機制和自動裝配原則 即宣告這個B

    多執行緒學習（4）：三種實現Java多執行緒的方法：Thread、Callable和Runable 的比較與區別

    2018年10月03日 目錄 前言 前言 JVM允許應用程式併發執行多執行緒：最常用的是兩個方法：（1）基礎Thread類，重寫run（）方法；（2）或實現Runnable 介面，實現介面的run（）方法；（3）另外一種方法是：實現callable 介面

    static、final和static的作用與區別

    static修飾符。可以用於修飾一個類的方法、變數，比如下面的www類，static修飾的方法稱為靜態方法，修飾的變數稱為靜態變數，靜態方法和靜態變數就直接屬於類，而不屬於該類的例項。 class  

    Lind.DDD.IoC依賴注入與面向方面的實現

    回到目錄 IoC是解耦的靈魂，很難想像一個框架中沒有IoC會變成什麼樣子，Lind.DDD裡的IoC是通過Unity實現的，由依賴注入(unity)和方法攔截組成(Interception),依賴注入可以通過事前定義好的實現方式去動態建立某個介面的例項，例如，在倉儲介面IRepository裡，你可以在配置

    .NET Core中的一個介面多種實現的依賴注入與動態選擇看這篇就夠了

    最近有個需求就是一個抽象倉儲層介面方法需要SqlServer以及Oracle兩種實現方式，為了靈活我在依賴注入的時候把這兩種實現都給注入進了依賴注入容器中，但是在服務呼叫的時候總是獲取到最後注入的那個方法的實現，這時候就在想能不能實現動態的選擇使用哪種實現呢？如果可以的話那麼我只需要在配置檔案中進行相應的配置

    集線器、交換機、路由器、閘道器的作用與區別

    交換機(Switch) 　　交換機是集線器的升級換代產品，外形上和集線器沒什麼分別，是一種在通訊系統中自動完成資訊交換功能的裝置，用途和HUB一樣也是連線組網之用，但是它具有比集線器更強大的功能。 　　交換機也叫交換式集線器，它通過對資訊進行重新生成，並經過內部處理後轉發至指定埠，具備自動定址能力和交換作用，

    畫素、解析度及PPI各自含義與區別及目前主流手機的解析度介紹

    一、畫素 畫素是構成點陣圖的基本單元，當點陣圖影象放大到一定程度時，所看到的一個一個的馬賽克色塊就是畫素且畫素色塊的大小不是絕對的。 1.物理畫素（裝置畫素） 一個顯示屏的成像原理是通過一系列的小點排列成一個大的矩形，不同的小點通過顯示不同的顏色來顯示成影

    spring之依賴注入與控制反轉的區別

     IoC——Inversion of Control  控制反轉  DI——Dependency Injection   依賴注入         要想理解上面兩個概念，就必須搞清楚如下的問題： 參與者都有誰？依賴：誰依賴於誰？為什麼需要依賴？ 注入：誰注入於誰？到底

    刪除表資料drop、truncate和delete的用法與區別

    說到刪除表資料的關鍵字,大家記得最多的可能就是delete了 然而我們做資料庫開發,讀取資料庫資料.對另外的兩兄弟用得就比較少了 現在來介紹另外兩個兄弟,都是刪除表資料的,其實也是很容易理解的 老大------drop 出沒場合:drop table  tb --tb表示資料表的名字,下同 絕招:刪除內容和