我有以下控制器:
myApp.controller('myCtrl', ['$scope', '$rootScope', '$location', 'myService',
function($scope, $rootScope, $location, myService) {
$scope.myArray = [];
$scope.myFunction = function() {
if (something) {
setTimeout(function(){
$scope.myFunction();
},500);
} else {
var itm = $rootScope.var;
for (var i in itm) {
if (itm.hasOwnProperty(i)) {
$scope.myArray.push(itm[i].value);
}
}
// first console.log
console.log($scope.myArray);
}
}
$scope.myFunction();
// second console.log
console.log($scope.myArray);
}
]);
在上面的示例中,第二个console.log
在第一个之前打印出来。为什么会这样?有没有办法让控制器等待执行/返回函数,然后才继续执行其余的代码?
答案 0 :(得分:1)
没有看到一切如何实施。这是我能帮到你的最好的。如果您希望控制器仅在承诺成功时执行某些操作,则可以围绕请求包装代码。在plunkr中,我编写了一个示例$ http服务,该服务对myFunction有一个使用$ q的虚假请求。
我建议使用工厂在控制器而不是$ rootScope之间共享数据。 $ rootScope很难在大型SPA中管理。 Plunkr评论了你可以在$ rootScope和使用Factory之间进行更改的选项。
以下的服务
app.service('Service', Service);
function Service($q, $rootScope, Factory) {
var deferred = $q.defer();
this.myFunction = function(){
//Using factory to persit data instead of $rootScope
//var itm = Factory.myArray;
var itm = $rootScope.var;
var array = [];
//Item isnt set return error
if(itm === undefined || itm === null) deferred.reject("$rootScope.var is not set")
//Changed this a bit didnt know what $rootScope.var actually was
for (var i in itm) {
array.push(itm[i]);
}
deferred.resolve(array);
return deferred.promise;
}
return this;
}
控制器执行的第一件事是初始化对Service.myFunction()的请求,并等待成功或错误回调。成功之后,您可以处理并执行您对承诺返回的数据所做的任何事情。如果出现错误,您可以按照自己的意愿处理。
app.controller('controller', controller);
function controller(Service, $rootScope) {
/* jshint validthis: true */
var vm = this;
vm.myArray = [];
vm.request = "";
//Un-Comment this to return success or error
$rootScope.var = [1,2,3,4,5,6];
//This is a fake http request
Service.myFunction().then(
//if the promise was resolved or $http was a success
//initilize the controller
function(data) {
vm.myArray = (data)
},
//if the promise was resolved or $http was a success
//initilize the controller
function(err) {
vm.request = (err)
})
}