当我从有界数据导出输出时，为什么我的自定义指令没有更新? [英] Why does my custom directive not update when I derive the output from the bounded data?

问题描述

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

Basically I have a custom directive which has an isolated scope. I two-way bind a piece of data and given those data, I generate some output. For example, the data is two numbers 1 and 3. In the link() function of the directive I create a new array generating a sequential number between the two numbers. That new array I set in the scope. In the template, I do an ng-repeat on that new array. If I change those two numbers, the template does not seem to pick up the change. Here is a jsfiddle sample of what I am talking about:

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

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

You can see that when you click on change, nothing happens. If you change the template for my directive to be:

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

将页面"更改为data.list".如果您点击更改，您可以看到列表现在将正确更改.

changing "pages" to "data.list". If you click on change, you can see that the list will now change properly.

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

I am new to angularjs. I looked to see if there was a question similar to mine, but couldn't find any. My apologies if this is formatted or done incorrectly. Thanks for any insight.

推荐答案

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

As Nikos said, if you really want to detect the change of all the properties of the data variable, you need to use deep watch as following:

    ...
    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.

这篇关于当我从有界数据导出输出时，为什么我的自定义指令没有更新?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！