3

在我的角度应用程序中，我有一个$scope带有.username

如果我在点击时将此变量设置为“测试”：

<a href="#" ng-click="setUser()">Set User</a>

与功能

$scope.user = {
  name: 'blank'
}

$scope.setUser = function(name) {
  $scope.user.name = name
}

这工作正常。但是，如果我在promise.then()* 中设置它，它似乎正确设置了变量，但 Angular 不会在视图中更新它，直到我对 $scope.user 执行另一个操作。

<a href="#" ng-click="startLogin()">Set User</a>

现在调用一个新函数，startLogin()

$scope.user = {
  name: 'blank';
};

$scope.setUser = function(name) {
  $scope.user.name = name;
};

$scope.startLogin = function() {
  var promise = Kinvey.ping();
  promise.then(function(response) {
    console.log('success');
    $scope.setUser('test');
  });
};

这样做之后。视图中的{{user.name}}字段仍然是“空白”。我还测试了以下内容：

  • $scope当我将它记录到控制台时，它在功能中还活着并且很好。
  • 日志记录也$scope.user正确返回，表明变量已更改。
  • 有趣的是，当我第二次点击时，视图终于改变了。
  • 我也可以通过添加来解决这个问题$scope.$apply()，但这似乎是解决这个问题的错误方法。

* 我正在使用Kinvey ，它使用与CommonJS 的 promise.then()类似或相同的语法

4

1 回答 1

5

两种方式的绑定在一个角度摘要周期中得到更新。这些循环由绑定到指令的 DOM 事件或参与 Angular 生态系统的其他实体触发。

因此，Angular 提供的“魔法”只是自动触发该摘要循环。您可以使用以下命令触发摘要循环$scope.apply：

promise.then(function(response) {
  $scope.$apply(function() {
     console.log('success');
     $scope.setUser('test');
  });
});

这是处理 3rd 方库时推荐的方法。

于 2013-10-02T16:07:14.280 回答