javascript - Angular.js 深度观察 Coffeescript 类实例

Question

我有一个像这样的 CoffeeScript 类：

class Foo
    constructor: (@bar) ->
        setTimeout () =>
            @bar = "changed!"
        , 5000)

在我的控制器中有一个这样的列表：

$scope.list = [new Foo("1"), new Foo("2")]

我有这样的 HTML：

<ul>
    <li ng-repeat="baz in list">
        {{baz.bar}}
    </li>
</ul>

5 秒后，项目的值会$scope.list发生变化，但这不会反映在 HTML 中。

部分连接正确，因为如果我添加此代码，一切正常（尽管有一点延迟）。HTML 已正确重绘和更新。

setInterval () ->
    $scope.$apply () ->
        $scope.crashes = $scope.crashes
, 5000)

当 CoffeeScript 类的属性发生变化时，有什么方法可以确保 HTML 更新？

score 1 · Accepted Answer

你试过了吗：

$scope.$watch('crashes', function (newVal) {
  $scope.crashes = newVal
}, true);

将 $watch 的最后一个参数设置为 true 使其成为深度监视。

score 0 · Accepted Answer

不要使用 setTimeout，因为 angularJS 不会跟踪更改，您需要像以前一样调用 $scope.$apply。使用$timeout。

编辑：您可以使用 $timeout 改进您发布的自定义超时解决方案，并删除 setInterval 和 apply。

2 回答 2