AngularJS:如何用异步数据初始化服务并将其注入到依赖服务中



我有类似于AngularJS中的情况:用异步数据初始化服务,但我需要将带有异步数据的基本服务注入到依赖服务中。它看起来像这样:

基本服务:

angular.module('my.app').factory('baseService', baseService);
baseService.$inject = ['$http'];
function baseService($http) {
var myData = null;
var promise = $http.get('api/getMyData').success(function (data) {
myData = data;
});
return {
promise: promise,
getData: function() {
return myData;
}};
}

从属服务(我在其中注入基本服务(

angular.module('my.app').factory('depentService', depentService);
depentService.$inject = ['baseService'];
function depentService(baseService) {
var myData = baseService.getData();
....
return {...};
}

路线:

angular.module('my.app', ["ngRoute"])
.config(function ($routeProvider) {
$routeProvider.when('/',
{
resolve: {
'baseService': function (baseService) {
return baseService.promise;
}
}
});
});

但什么也没发生,baseService.getData()仍然返回null(因为async api调用仍在进行中(。我的ngRoute配置似乎无效,但我无法在其中指示任何控制器/模板。如何正确解析我的baseService并在Depend服务中获取数据?

依赖服务应该使用promise和return promise:

angular.module('my.app').factory('depentService', depentService);
depentService.$inject = ['baseService'];
function depentService(baseService) {
̶v̶a̶r̶ ̶m̶y̶D̶a̶t̶a̶ ̶=̶ ̶b̶a̶s̶e̶S̶e̶r̶v̶i̶c̶e̶.̶g̶e̶t̶D̶a̶t̶a̶(̶)̶;̶
var promise = baseService.promise;

var newPromise = promise.then(function(response) {
var data = response.data;
//...
var newData //...
return newData;
}); 
return newPromise;
}

尝试使用原始数据可能会与从属服务在主数据从服务器返回之前运行的情况相竞争。

来自文档:

.then方法返回一个新的promise,该promise通过successCallbackerrorCallback的返回值被解析或拒绝(除非该值是promise,在这种情况下,它是使用promise链接在该promise中解析的值来解析的(。

-AngularJS$q服务API参考-承诺API

最新更新