Question

我正在使用fcsaNumber指令检查输入到输入框中的数字的有效性。我得到了这个工作，但我检查的值是动态的，这意味着它可以根据选择的选项而改变。看来这个指令只初始化一次。当选项发生变化时，我需要做些什么才能重新初始化？

//this works fine
    <input name="Employees" type="text" ng-model="Input.Employees" fcsa-number="{min: 1}" required="">

//this only inits once, so its not dynamic
    <input name="Employees" type="text" ng-model="Input.Employees" fcsa-number="{{getMin()}}" required="">

Answer 1

您可以使用ng-if初始化/拆除相关指令。（ng-if docs）

ngIf指令删除或重新创建DOM树的一部分基于表达式。如果分配给ngIf的表达式求值如果为false，则从DOM中删除该元素，否则为a 将元素的克隆重新插入DOM - CodeHater

ng-if和ng-show之间的区别stack overflow answer非常棒{{3}}。

Answer 2

重建整个指令会起作用，但它是一个强力解决方案 - 对于像这样接受用户输入的指令尤其不可取，如果你重新启动指令，那将会被吹走。

相反，您可以使用scope.$watch或attrs.$observe来允许指令更轻松地响应其属性值的更改：

module.directive('foo', function() {
    return {
        scope: {
            'bar': '@'
        },
        link: function(scope, element, attrs) {
            scope.$watch('bar', function() {
                // runs when scoped value 'bar' changes
            });
            attrs.$observe('baz', function() {
                // Similar to $watch, but without isolate scope
            });
        }
    }
});

AngularJS : Difference between the $observe and $watch methods对$ observe和$ watch之间的差异有很好的解释。

如何重新初始化Angular指令？

2 个答案: