Question

下面的代码和演示演示的单向绑定有一点我不明白：

var example = {
    bindings: {
        obj: '<',
        prim: '<'
    },
    template: `
        <div class="section">
            <h4>
                Isolate Component
            </h4>
            <p>Object: {{ $ctrl.obj }}</p>
            <p>Primitive: {{ $ctrl.prim }}</p>
            <a href="" ng-click="$ctrl.updateValues();">
                Change Isolate Values
            </a>
        </div>
    `,
    controller: function () {
        this.updateValues = function () {
            this.prim = 10;
            this.obj = {
                john: {
                    age: 35,
                    location: 'Unknown'
                }
            };
        };
    }
};

function ParentController() {
    this.somePrimitive = 99;
    this.someObject = {
        todd: {
            age: 25,
            location: 'England, UK'
        }
    };
    this.updateValues = function () {
        this.somePrimitive = 33;
        this.someObject = {
            jilles: {
                age: 20,
                location: 'Netherlands'
            }
        };
    };
}

angular
   .module('app', [])
   .component('example', example)
   .controller('ParentController', ParentController);

DEMO

我不理解的是，如果在隔离范围内修改原始值，原始值会如何变化（或不会发生变化）。据我所知，如果单向绑定基元，如果在隔离范围内更改该值，绑定将会中断。使用break我的意思是父级的更新不再传播到隔离的范围。但是，在演示中，它并没有完全像那样工作。

如何重现：转到DEMO并首先点击Change isolate values按钮。这将改变隔离范围中的原语。然后单击Change Parent Values按钮。如您所见，隔离范围内的原语仍然会更新。基于此，我想如果更新隔离范围内的原语，绑定不会中断，对吧？！但现在事情变得奇怪了。如果你重复这一点，你会注意到这次绑定不再起作用了。

有人可以解释为什么原始价值第一次发生了变化但第二次没有变化吗？

更新：找到解决方案。绑定工作完美，因为父级的值不再变化，它始终为10. Here是一个更新的示例，表明它仍然有效

理解角度为1.5的单向绑定

0 个答案: