AngularJS中使用service,並同步資料

2021-09-04 04:14:56 字數 1625 閱讀 9910

service是單例物件,在應用中不同**塊之間共享資料。

對一些公用的方法封裝到service中,然後通過依賴注入在controller中呼叫,示例**:

1.建立乙個模組:

var module = angular.module( "my.new.module", );

2.建立乙個service服務:

module.service( 'book', [ '$rootscope', function( $rootscope ) ,

],addbook: function ( book )

}return service;

}]);

3.在controller中呼叫:

但是,當涉及到非同步請求的時候,service的資料就可能會在controller呼叫的時候不同步,比如:

定義乙個service,用來請求json資料:

在controller中呼叫:

這時候,控制台列印顯示:data有資料,但是s為undefined。

具體原因我沒去深究,大概猜測是非同步請求資料的原因,因為第二次呼叫getcapt方法的時候s有資料了,所以通過內建服務$q來進行資料的同步呼叫:

service這樣寫:

var service=}).success(function(data)

);return deferred.promise;//返回承諾,這裡並不是最終資料,而是訪問最終資料的api

}}controller這樣呼叫:

vservice.getcode($scope.mobile).then(function(data))

如此實現了資料同步呼叫。  

使用promise模式:

Angular JS 使用技巧

最近用angular js做為前端框架,本文記錄一些使用過程中的技巧,只做用法的描述,不做過多原理上的討論。angular.element document ready function 假設這樣一種情況。你在接收乙個專案的時候,看到別人已經寫了下面的 後面的 省略 ul.現在你需要在頁面中嵌入廣告...

angularjs個人使用總結

1.資料自動重新整理問題 1 ng model是雙向資料繫結 scope view層,在js中如果資料更新,頁面的值也會自動更新,但ng model只能在有限的表單幾個元素中使用,例如,2 ng bind單向資料繫結 scope view層,在js中如果資料更新,頁面的值也會自動更新,但ng bin...

AngularJS中ng class使用方法

有三種方法 1 通過 scope繫結 不推薦 2 通過物件陣列繫結 3 通過key value鍵值對繫結 實現方法 function ctrl scope 2 通過物件陣列繫結 function ctrl scope 當isselected為true時,增加selected樣式 當isselecte...