angularjs - 如何在 Angular 指令中绑定(bind) bool 值？

Question

我想将一些 bool 属性绑定(bind)/设置到指令。但我真的不知道如何做到这一点并实现以下行为。

想象一下，我想为一个结构设置一个标志，假设一个列表是否可折叠。我有以下 HTML 代码:

<list items="list.items" name="My list" collapsable="true"></list>

items是双向绑定(bind)的，name只是一个属性

我想要 collapsable属性在列表的 $scope 中可用，方法是传递一个值(true、false 或其他)，或者双向绑定(bind)

<list items="list.items" name="{{list.name}}" collapsable="list.collapsed"></list>

我正在开发一些 UI 组件，我想提供多种与它们交互的方式。也许，随着时间的推移，有些人想通过将对象的属性传递给属性来了解该组件的状态，无论是折叠还是未折叠。

有没有办法做到这一点？如果我误解了什么或我错了，请纠正我。

谢谢

Answer 1

您可以为 bool 值配置自己的单向数据绑定(bind)行为，如下所示:

link: function(scope, element, attrs) {

    attrs.$observe('collapsable', function() {

        scope.collapsable = scope.$eval(attrs.collabsable);
    });

}

在此处使用 $observe 意味着您的“监视”仅受属性更改的影响，如果您直接更改指令中的 $scope.collapsable 则不会受到影响。