当我从有界数据派生输出时，为什么我的自定义指令没有更新？

Question

基本上我有一个自定义指令，它有一个独立的范围。我双向绑定一段数据并根据这些数据生成一些输出。例如，数据是两个数字 1 和 3。在指令的 link() 函数中，我创建了一个新数组，生成两个数字之间的序号。我在范围内设置的新数组。在模板中，我对该新数组执行 ng-repeat。如果我更改这两个数字，模板似乎不会接受更改。这是我正在谈论的 jsfiddle 示例：

http://jsfiddle.net/m2jf1Lw7/1/

您可以看到当您点击更改时，没有任何反应。如果您将我的指令的模板更改为：

template: '<ul><li ng-repeat="d in data.list" my-button="d"></li></ul>'

将 "pages" 更改为 "data.list"。如果单击更改，您可以看到列表现在将正确更改。

我是 angularjs 的新手。我看了看是否有与我类似的问题，但找不到。如果格式不正确或操作不正确，我深表歉意。感谢您的任何见解。

Answer 1

'=' 作用域绑定在您传递给它的变量上创建一个监视，在您的例子中是 data。因此 data 中的任何更改都会触发监视并更新隔离范围。

观察对象默认使用等式，不深度观察：如果对象引用保持不变，则不是被认为改变了，不管它的内容发生了什么。在您的情况下，您正在更改 data 的内容，而不是对 data 本身的引用。

与 data.list 相同：当您观看 data.list 然后将 $scope.data.list 设置为不同的值时，参考发生变化并且手表被触发。

Answer 2

正如 Nikos 所说，如果你真的想检测 data 变量的所有属性的变化，你需要使用 deep watch 如下：

    ...
    link: function (scope, element, attrs) {
        scope.$watch(function () {
            return scope.data
        }, function () {
            var pages = [];
            for (var i = scope.data.list[0]; i <= scope.data.list[1]; i++) {
                pages.push(i);
            }
            scope.pages = pages;
        }, true); // The third parameter is true for deep watch
    },
    ...

JSFiddle.

当我从有界数据派生输出时，为什么我的自定义指令没有更新？

Why does my custom directive not update when I derive the output from the bounded data?

javascript

angularjs

angularjs-directive