Question

我创建了一个带有隔离范围的自定义指令，该范围使用双向数据绑定回父范围。范围/绑定似乎都正常工作，但模板/视图在更改时不会自动更新dom中的绑定属性。我可以通过阅读指令的模型来强制更新dom。

http://plnkr.co/edit/vPGm1oO0sSaHVvcrp2Ev

注意：在这个plunkr示例中，我使用wiglet 1的作用域上的isActive属性作为绑定属性。请注意，我在创建范围时将值打印到控制台，并且在2秒后通过window.timeout更新它...所以您可以看到，此时数据已更改，但dom没有。要查看dom更改，请单击任一wiglet上的“print”按钮，这样只会再次将isActive的值打印到控制台。这会导致dom更新。

这是一个错误，还是我做错了什么？

Answer 1

AngularJS仅在范围摘要周期内更新绑定变量;这通常会自动发生在Angular托管事件（ng-click等）上，但在异步代码中，例如setTimeout，您必须手动调用Scope#$apply()或Scope#$digest()：< / p>

$window.setTimeout(function(){
  $scope.$apply(function() {
    $scope.wiglets[0].isActive = true;
    console.log("Wiglet 1 isActive:", $scope.wiglets[0].isActive);
  });
}, 2000);

这与setTimeout非常相似，AngularJS有一个内置服务，名为$timeout，可以为您执行此操作：

$timeout(function(){
  $scope.wiglets[0].isActive = true;
  console.log("Wiglet 1 isActive:", $scope.wiglets[0].isActive);
}, 2000);

示例：http://plnkr.co/edit/XDK06uhYMNcI6fs6SuHP?p=preview

AngularJS模板绑定不会在数据更改时更新，但在读取模型时会更新

1 个答案: