angular 控制器在工厂完成之前正在执行

Question

我已将一些通用代码移至工厂。但是控制器在工厂加载之前正在执行。在这种情况下，我得到空白响应（零结果）

谁能提出最佳解决方案。

这是我的 angular 工厂，

app.factory('TabsFactory', function($resource){
    var activetabs = {};            
    activetabs.getDepositAccountDetails = function() {
        return $resource('xxxx/:number', {}, {
            getDepositAccountDetailsService: {
                method: 'GET',
                isArray: false
            }
        });
    }
    activetabs.getAccountInfo = function(){
        return accountinit.accountInfo;
    }
    activetabs.setAccountInfo = function(accountnumber, result) {
         var accountinit = {
                accountInfo: []
            }
        if (result.code == "v") {           
            activetabs.getDepositAccountDetails().getDepositAccountDetailsService({
                number: accountnumber
            }).$promise.then(function(response) {
               accountinit.accountInfo = response; 
              //here i am getting the JSON response
            }, function(error) {

            });
        }
        return accountinit;
    }
    return activetabs;
  });

控制器，

TabsFactory.setAccountInfo(accountnumber, $scope.accountInfo);    
$scope.accountInfo = TabsFactory.getAccountInfo();
alert(JSON.stringify($scope.accountInfo));

Answer 1

是的，这会发生，因为 JavaScript 执行异步操作，但您的控制器以一种它期望事情是同步操作的方式。

当您调用 TabsFactory.getAccountInfo() 时，您的 $resource('xxxx/:number') 可能仍未完成，响应已准备好供您处理！！

那么，怎么办？您已经使用了promise。我通常有一个存储库（一个具有 return 承诺的方法的工厂）来处理服务器通信。这是一个例子：

app.factory('accountRepository', ["$http","$q",function($http,$q){

   return {
        getDepositAccountDetails : function(id) {
           var deferred = $q.defer();
           $http.ger('xxx').success(deferred.resolve).error(deferred.reject);
           return deferred.promise;
        }
   };
}] );

我的存储库将有更多操作，如添加帐户、更新帐户信息等。

my controller/service 然后调用这些方法如下：

accountRepository.getDepositAccountDetails(123).then(function(response) {
           // Process the response..
 }, function(error) {
           // Some error occured! handle it
 });

这样做，我的代码只有在我收到服务器的响应并且数据已准备好供使用或显示后才会执行。希望这有帮助..

更新： 你可能想看看 this 来了解一下 ;)

Answer 2

您应该使用链式承诺来更新范围变量，因为您的 accountInfo 变量在 $resource 承诺中更新。

代码

TabsFactory.setAccountInfo(accountnumber, $scope.accountInfo).then(function(data){
  $scope.accountInfo = TabsFactory.getAccountInfo();
  alert(JSON.stringify($scope.accountInfo));
});

更新

服务方法应该return 承诺以继续承诺链

activetabs.setAccountInfo = function(accountnumber, result) {
     var accountinit = {
            accountInfo: []
        }
    if (result.code == "v") {
        //added return below      
        return activetabs.getDepositAccountDetails().getDepositAccountDetailsService({
            number: accountnumber
        }).$promise.then(function(response) {
           accountinit.accountInfo = response; 
           return accountinit.accountInfo;
          //here i am getting the JSON response
        }, function(error) {

        });
    }
    return accountinit;
}

angular 控制器在工厂完成之前正在执行

angular controller is executing before factory complete

javascript

promise

angularjs

angular-resource

angular-promise