欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

AngularJs Managing Service Dependencies詳解

 更新時(shí)間:2016年09月02日 15:27:08   作者:Lcllao  
本站主要介紹AngularJs Managing Service Dependencies的知識(shí)資料,這里整理相關(guān)知識(shí),及簡(jiǎn)單示例代碼,有興趣的小伙伴可以參考下

  angular允許service將其他service聲明為依賴,使用在自身實(shí)例化時(shí)使用的構(gòu)造函數(shù)中。

  為了聲明依賴,我們需要在工廠方法聲明中指定它們,并且在工廠方法中通過$inject屬性(字符串標(biāo)識(shí)數(shù)組)或者使用array notation。

  通常$inject屬性聲明可以被丟棄(即http://www.dbjr.com.cn/article/91815.htm中提到的隱式依賴注入,但這個(gè)是實(shí)驗(yàn)屬性,在而且在壓縮混淆后會(huì)失效,慎用?。?。

使用array notation

function myModuleCfgFn ($provide) {
  $provide.factory(‘myService',[‘dep1','dep2',function(dep1,dep2){}]);
}

使用$inject屬性   

function myModuleCfgFn($provide) {
   var myServiceFactory = function(dep1, dep2) {};
   myServiceFactory.$inject = ['dep1', 'dep2'];
   $provide.factory('myService', myServiceFactory);
 }

使用隱式DI(不兼容壓縮混淆的代碼)

function myModuleCfgFn($provide) {
  $provide.factory('myService', function(dep1, dep2) {});
}

       下面有一個(gè)例子,里面有兩個(gè)service,它們之間存在依賴關(guān)系,以及其他一些angular提供的service。

 /**
 * batchLog service 允許消息在內(nèi)存中形成隊(duì)列,50秒flush一次。
 *
 * @param {*} message Message to be logged.
 */
 function batchLogModule($provide){
   $provide.factory('batchLog', ['$timeout', '$log', function($timeout, $log) {
     var messageQueue = [];
     function log() {
       if (messageQueue.length) {
         $log('batchLog messages: ', messageQueue);
         messageQueue = [];
       }
       $timeout(log, 50000);
     }
     log(); 
     return function(message) {
       messageQueue.push(message);
     }
   }]);
   /**
   * routeTemplateMonitor監(jiān)控每一個(gè)route的變化,每個(gè)比阿奴啊都會(huì)通過batchLog service記錄下來
   */
   $provide.factory('routeTemplateMonitor',
     ['$route', 'batchLog', '$rootScope',
     function($route, batchLog, $rootScope) {
       $rootScope.$on('$routeChangeSuccess', function() {
         batchLog($route.current ? $route.current.template : null);
       });
   }]);
 }
 // 獲得主service,運(yùn)行應(yīng)用(監(jiān)聽事件)
  angular.injector([batchLogModule]).get('routeTemplateMonitor');

例子中需要注意的事項(xiàng):

  1. batchLog service依賴angular內(nèi)置的$timeout(http://docs.angularjs.org/api/ng.$timeout)與$log services(http://docs.angularjs.org/api/ng.$log),實(shí)現(xiàn)通過console.log批量log消息。
  2. routeTemplateMonitor service依賴內(nèi)置的$route(http://docs.angularjs.org/api/ng.$route) service與我們自定義的batchLog service。
  3. 我們兩個(gè)service都使用工廠方法簽名以及array notation來注釋inject,聲明它們的依賴。array中的字符串標(biāo)識(shí)的順序與工廠方法簽名(參數(shù))中的順序必須一致,這十分重要。除非在工廠方法參數(shù)中使用隱式依賴聲明,否則,injector將根據(jù)array中字符串的順序決定inject哪一個(gè)服務(wù)。

以上就是關(guān)于AngularJs Managing Service Dependencies 資料的整理,后續(xù)繼續(xù)添加相關(guān)資料,謝謝大家對(duì)本站的支持!

相關(guān)文章

  • 詳解AngularJS 模態(tài)對(duì)話框

    詳解AngularJS 模態(tài)對(duì)話框

    在涉及GUI程序開發(fā)的過程中,常常有模態(tài)對(duì)話框以及非模態(tài)對(duì)話框的概念。接下來通過本文給大家介紹AngularJS 模態(tài)對(duì)話框 ,感興趣的朋友一起學(xué)習(xí)吧
    2016-04-04
  • 詳解Angular依賴注入

    詳解Angular依賴注入

    依賴注入(DI -- Dependency Injection)是一種重要的應(yīng)用設(shè)計(jì)模式。Angular里面也有自己的DI框架,在設(shè)計(jì)應(yīng)用時(shí)經(jīng)常會(huì)用到它,它可以我們的開發(fā)效率和模塊化程度。 Angular系統(tǒng)中通過在類上添加@Injectable裝飾器來告訴系統(tǒng)這個(gè)類(服務(wù))是可注入的。
    2021-05-05
  • angular雙向綁定詳解

    angular雙向綁定詳解

    這篇文章主要為大家介紹了angular雙向綁定,具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下,希望能夠給你帶來幫助
    2021-12-12
  • 淺談angular4 ng-content 中隱藏的內(nèi)容

    淺談angular4 ng-content 中隱藏的內(nèi)容

    本篇文章主要介紹了淺談angular4 ng-content 中隱藏的內(nèi)容,小編覺得挺不錯(cuò)的,現(xiàn)在分享給大家,也給大家做個(gè)參考。一起跟隨小編過來看看吧
    2017-08-08
  • Angular5整合富文本編輯器TinyMCE的方法(漢化+上傳)

    Angular5整合富文本編輯器TinyMCE的方法(漢化+上傳)

    TinyMCE是一個(gè)輕量級(jí)的富文本編輯器,相對(duì)于CK編輯器更加精簡(jiǎn),但必須滿足絕大部分場(chǎng)景的需要。這篇文章主要介紹了Angular5整合富文本編輯器TinyMCE(漢化+上傳)的相關(guān)知識(shí),需要的朋友可以參考下
    2020-05-05
  • Angularjs中ng-repeat-start與ng-repeat-end的用法實(shí)例介紹

    Angularjs中ng-repeat-start與ng-repeat-end的用法實(shí)例介紹

    這篇文章主要給大家介紹了Angularjs中ng-repeat-start與ng-repeat-end的用法,文章開始先進(jìn)行了簡(jiǎn)單的介紹,而后通過完整的實(shí)例代碼詳細(xì)給大家介紹這兩者的用法,有需要的朋友們可以參考借鑒,下面來一起看看吧。
    2016-12-12
  • 詳解Angular的數(shù)據(jù)顯示優(yōu)化處理

    詳解Angular的數(shù)據(jù)顯示優(yōu)化處理

    本文主要對(duì)Angular的數(shù)據(jù)顯示優(yōu)化處理進(jìn)行詳細(xì)介紹,具有一定的參考價(jià)值,下面跟著小編一起來看下吧
    2016-12-12
  • Angular在一個(gè)頁(yè)面中使用兩個(gè)ng-app的方法

    Angular在一個(gè)頁(yè)面中使用兩個(gè)ng-app的方法

    這篇文章主要介紹了Angular在一個(gè)頁(yè)面中使用兩個(gè)ng-app的方法,非常不錯(cuò),具有參考借鑒價(jià)值,需要的朋友可以參考下
    2017-02-02
  • 詳解Webstorm 下的Angular2.0開發(fā)之路(圖文)

    詳解Webstorm 下的Angular2.0開發(fā)之路(圖文)

    這篇文章主要介紹了詳解Webstorm 下的Angular2.0開發(fā)之路(圖文) ,小編覺得挺不錯(cuò)的,現(xiàn)在分享給大家,也給大家做個(gè)參考。一起跟隨小編過來看看吧
    2018-12-12
  • AngularJS自定義過濾器用法經(jīng)典實(shí)例總結(jié)

    AngularJS自定義過濾器用法經(jīng)典實(shí)例總結(jié)

    這篇文章主要介紹了AngularJS自定義過濾器用法,結(jié)合實(shí)例形式總結(jié)分析了AngularJS自定義過濾器進(jìn)行包含、替換、篩選、過濾、排序等操作相關(guān)實(shí)現(xiàn)技巧與注意事項(xiàng),需要的朋友可以參考下
    2018-05-05

最新評(píng)論