javascript - 直到第二次方法完成后才设置范围

Question

我在范围内设置属性时遇到问题。它确实设置了，但只有在我第二次单击与 Controller 绑定(bind)的按钮后才设置。

app.controller('ContactsController',  ['$scope','$window','$http','googleService', function($scope, $window, $http, googleService) {

 $scope.login = function () {
  var emails =[];
  var promise =  googleService.login()
      promise.then(function (data) {
        console.log(data[0]);
        gapi.client.load('gmail', 'v1', function() {
            var request = gapi.client.gmail.users.messages.list({'userId' :'me',
            labelIds: ['INBOX'],
            });
            request.execute(function(resp) {
            $scope.emails  = googleService.makeEmails(resp);             
            });
        });                                                                                 
       }

      , function (err) {
        console.log('Failed: ' + err);

      });   
   };
}]);

这是我的服务方法。

this.makeEmails = function(resp){
 var factory = [];
    angular.forEach(resp.messages, function(message){
            var newEmail = gapi.client.gmail.users.messages.get({'userId': 'me','id': message.id ,'format':'metadata', 'metadataHeaders': ['subject','from','to','date']});
                newEmail.execute(function(resp) {
                    var emailw = resp;

                    factory.push(emailw);
                });
        });
        return factory;
 }

因此，我单击与 Controller 中的 click() 方法关联的按钮，在网络选项卡中，我看到所有响应都通过，并且当我单步执行代码工厂时，正在设置。我只是不明白为什么第一次点击范围没有设置但第二次点击设置了它。

Answer 1

需要注意的是:这里接受的答案是使用一种不鼓励的做法，称为 deferred antipattern 。您应该避免这样做，因为它会导致冗长的代码无法正确处理错误。

我强烈建议您使用以下方法，该方法更简洁、更稳健:

//service
this.makeEmails = function (resp) {
    var promises = resp.messages.map(function (message) {
        return $q(function (resolve) {
            gapi.client.gmail.users.messages.get({
                'userId': 'me',
                'id': message.id,
                'format': 'metadata',
                'metadataHeaders': ['subject', 'from', 'to', 'date']
            }).execute(resolve);
        });
    });

    return $q.all(promises);    
};

//controller
googleService.makeEmails(resp).then(function(result){
    $scope.emails = result;
});