我需要在加载任何状态之前解析 http 调用
angular.module('myModule', [])
.run(function($http, MyFactory) {
$http.get('/api..')
.success(function(data){
MyFactory.setData(data);
//Store data in a service
});
})
.config(function($stateProvider) {
$stateProvider
.state('main', {...})
.state('main.app'{
url: '/app'
resolve: {
data: function(MyFactory) {
MyFactory.getData();
// This block needs to be run after my $http call in 'run' has been resolved.
return ..
}
}
}
});
.factory('MyFactory', function () {
var data = '';
return {
setData: function(_data) {
data = _data
},
getData: function() {
return data;
}
}
};
我试图将 $http
作为我的第一个状态 .main
的解析,但如果你直接转到 .main.app
,第一个 resolve 在第二个 resolve 之后执行。
最佳答案
我相信您可以使用以下模式制定依赖 promise 解决方案,其中 setData
链将在 .main
中完成,并在我们解析 getData< 时得到满足
在 .main.app
中。无需在 .run()
中执行此操作,相反,下面是对我认为您正在尝试完成的内容的简单解释...
.factory('MyFactory', function($http, $q) {
function setData() {
var deferred = $q.defer();
$http.get('/endpoint').success(function(response) {
// do something with data - we just want to resolve the response so this block is executed
deferred.resolve(response)
});
return deferred.promise;
}
function getData() {
return $http.get('/endpoint');
}
return {
getData: 'getData',
storeData: 'storeData'
}
});
.state('main', {
resolve : {
set: ['MyFactory', function(MyFactory) {
return MyFactory.setData();
}]
}
})
.state('main.app', {
resolve: {
data: ['set', 'MyFactory', function(saved, MyFactory) {
// -- set must be resolved
return MyFactory.getData();
}]
}
});
关于javascript - 在执行配置之前等待异步调用运行(Angular JS),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/33286705/