为什么 AngularJS ng-bind 不更新视图答案

【问题标题】：Why AngularJS ng-bind does not update the view为什么 AngularJS ng-bind 不更新视图
【发布时间】：2015-04-10 05:38:57
【问题描述】：

为什么当ng-bind属性改变时这个小角度模块不能更新视图？

<body ng-app="bindExample">

<script>
  angular.module('bindExample', [])
    .controller('ExampleController', ['$scope', function($scope) {
      var vm = this;
      vm.name = 'Whirled';
      window.setInterval(function(){ vm.name = 'Jon';}, 5000);
    }]);
</script>

<div ng-controller="ExampleController as vm">
    Hello <span ng-bind="vm.name"></span>!
</div>
</body>

我预计 5 秒后输出会更改 Hello Jon，因为它会保持在 Hello Whirled。为什么是这样？我还需要做什么吗？

【问题讨论】：

标签： javascript angularjs ng-bind

【解决方案1】：

使用$interval为其服务

Angular 的 window.setInterval 包装器是 DOC

$interval(function(){
     vm.name = 'Jon';
}, 1000);

别忘了注入$interval as，

.controller('ExampleController', ['$scope', $interval, function($scope, $interval) { ....

当使用setInterval 时，它超出了角度范围，因此您需要在此处使用$interval。 $interval 是针对作用域执行的，

或使用$scope.$apply()

window.setInterval(function(){
    vm.name = 'Jon';
    $scope.$apply();
}, 5000);

$apply 可以将更改与摘要循环集成

this answer would be helpful

【讨论】：

谢谢。如果我调用 AJAX 来读取值，然后将其应用于我的资源 success 函数中的模型，我是否还需要使用 $apply？
如果你使用 Angular 的 $http 服务从服务器获取数据，那么不需要调用 $scope.apply();
不，如果你使用 angular $http 服务作为最后评论中提到的#neilhem，但如果你使用像 jquery ajax 你需要使用 $apply() 那里告诉 angular 有什么东西出来在作用域旁边，需要绑定到作用域。

【解决方案2】：

是的，使用 $interval 是一种解决方案。通常你会在 $scope 的方法属性上改变模型。所以 Angular 将负责更新视图。如果您在指令中使用 jQuery 回调，则必须使用 scope.$apply 以便 Angular 知道发生了什么

【讨论】：