日韩性视频-久久久蜜桃-www中文字幕-在线中文字幕av-亚洲欧美一区二区三区四区-撸久久-香蕉视频一区-久久无码精品丰满人妻-国产高潮av-激情福利社-日韩av网址大全-国产精品久久999-日本五十路在线-性欧美在线-久久99精品波多结衣一区-男女午夜免费视频-黑人极品ⅴideos精品欧美棵-人人妻人人澡人人爽精品欧美一区-日韩一区在线看-欧美a级在线免费观看

歡迎訪問 生活随笔!

生活随笔

當前位置: 首頁 > 编程资源 > 编程问答 >内容正文

编程问答

走进AngularJs(六) 服务

發布時間:2025/3/18 编程问答 19 豆豆
生活随笔 收集整理的這篇文章主要介紹了 走进AngularJs(六) 服务 小編覺得挺不錯的,現在分享給大家,幫大家做個參考.

  今天學習了一下ng的service機制,作為ng的基本知識之一,有必要做一個了解,在此做個筆記記錄一下。

一、認識服務(service)

  服務這個概念其實并不陌生,在其他語言中如java便有這樣的概念,其作用就是對外提供某個特定的功能,如消息服務,文件壓縮服務等,是一個獨立的模塊。ng的服務是這樣定義的:

Angular services are singletons objects or functions that carry out specific tasks common to web apps.

  它是一個單例對象或函數,對外提供特定的功能。

  • 首先是一個單例,即無論這個服務被注入到任何地方,對象始終只有一個實例。
  • 其次這與我們自己定義一個function然后在其他地方調用不同,因為服務被定義在一個模塊中,所以其使用范圍是可以被我們管理的。ng的避免全局變量污染意識非常強。

  ng提供了很多內置的服務,可以到API中查看http://docs.angularjs.org/api/。知道了概念,我們來拉一個service出來溜溜,看看到底是個什么用法。(從這篇文章開始,我就使用jsfiddle來寫示例代碼了,再也不折騰博客園的變態編輯器了~)  


  我們在controller中直接聲明$location服務,這依靠ng的依賴注入機制。$location提供地址欄相關的服務,我們在此只是簡單的獲取當前的地址。

  服務的使用是如此簡單,我們可以把服務注入到controller、指令或者是其他服務中。

二、自定義服務

  如同指令一樣,系統內置的服務以$開頭,我們也可以自己定義一個服務。定義服務的方式有如下幾種:

  • 使用系統內置的$provide服務
  • 使用Module的factory方法
  • 使用Module的service方法

  下面通過一個小例子來分別試驗一下。我們定義一個名為remoteData服務,它可以從遠程獲取數據,這也是我們在程序中經常使用的功能。不過我這里沒有遠程服務器,就寫死一點數據模擬一下。


//使用$provide來定義var app = angular.module('MyApp', [], function($provide) {$provide.factory('remoteData', function() {var data = {name:'n',value:'v'};return data;}); });

//使用factory方法 app.factory('remoteData',function(){var data = {name:'n',value:'v'};return data; });

//使用service方法 app.service('remoteData',function(){this.name = 'n';this.value = 'v'; });

  Module的factory和$provide的factory方法是一模一樣的,從官網文檔看它們其實就是一回事。至于Module內部是如何調用的,我此處并不打算深究,我只要知道怎么用就好了。

  再看Module的service方法,它沒有return任何東西,是因為service方法本身返回一個構造器,系統會自動使用new關鍵字來創建出一個對象。所以我們看到在構造器函數內可以使用this,這樣調用該服務的地方便可以直接通過remoteData.name來訪問數據了。

  下面我們來用一下自己定義好的服務:


三、管理服務的依賴關系

  服務與服務中間可以有依賴關系,例如我們這里定義一個名為validate的服務,它的作用是驗證數據是否合法,它需要依賴我們從遠程獲取數據的服務remoteData。代碼如下:


?  在factory的參數中,我們可以直接傳入服務remoteData,ng的依賴注入機制便幫我們做好了其他工作。不過一定要保證這個參數的名稱與服務名稱一致,ng是根據名稱來識別的。若參數的名次與服務名稱不一致,你就必須顯示的聲明一下,方式如下:


app.factory('validate',['remoteData',function(remoteDataService){return function(){if(remoteDataService.name=='n'){alert('驗證通過');}}; }]);

  我們在controller中注入服務也是同樣的道理,使用的名稱需要與服務名稱一致才可以正確注入。否則,你必須使用$inject來手動指定注入的服務。比如:


function testC(scope,rd){scope.getData = function(){alert('name:'+rd.name+' value:'+rd.value);} } testC.$inject = ['$scope','remoteData'];

?-------------------補充于2014.01.11-------------------------

  感謝@Terry Sun指出,在controller中注入服務,也可以在定義controller時使用數組作為第二個參數,在此處把服務注入進去,這樣在函數體中使用不一致的服務名稱也是可以的,不過要確保注入的順序是一致的,如:


app.controller('testC',['$scope','remoteData',function($scope,rd){$scope.getData = function(){alert('name:'+rd.name+' value:'+rd.value);} }]);

?

  ng服務的基本知識也就這些了。目前只是學些皮毛,或許以后用到項目中了才能體會到他的強大之處,以及在真實使用中的這樣那樣的問題。


來源:http://www.cnblogs.com/lvdabao/p/3464015.html



來自為知筆記(Wiz)

總結

以上是生活随笔為你收集整理的走进AngularJs(六) 服务的全部內容,希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯,歡迎將生活随笔推薦給好友。