更新 angular 事件范围

Update angular scope on events

我正在将 Web 服务客户端包装到 angular 服务中。这个特定的客户端会像这样为特定的更新发送事件:

app.service('AngularClient', function () {
  this.info = null
  this.login = function () {
    client.login(loginInfo).then(function (loggedClient) {
      loggedClient.on('newInfo', function (info) {
        this.info = info
      })
    })
  }
})

控制器使用此服务并将其绑定到其 $scope:

app.controller('Ctrl', function (AngularClient, $scope) {
   $scope.client = AngularClient
})

但是,任何时候触发 'newInfo' 事件 angular 都不会自动触发 digest 循环,所以我无法控制 info 何时更新在 UI。 angular 确保这种情况每次都发生的方法是什么?

如果您想继续接收登录事件的更新,您可以这样做:

app.service('AngularClient', function () {
  this.info = null
  this.loginCallback = null
  this.login = function () {
    client.login(loginInfo).then(function (loggedClient) {
      loggedClient.on('newInfo', function (info) {
        this.info = info
        if (this.loginCallback) this.loginCallback(info);
      })
    })
  }
})

app.controller('Ctrl', function (AngularClient, $scope) {
   $scope.client = AngularClient
   AngularClient.loginCallback = function(info, err){ // optional error
     $scope.user.property = info.property;
     $scope.$apply();
   }
})

Angular 如果使用您的代码创建的自定义异步方法,将不会意识到它应该再次消化。

解决这个问题的一种方法是使用 $scope.$apply()。但是 $scope 不会暴露给您的服务。所以在你的 angular 控制器上,你可以将事件的监听函数包装到 $apply();

$scope.$apply(function () {
    //your code here.    
});

http://jimhoskins.com/2012/12/17/angularjs-and-apply.html