Angular有條件地在指令模板中使用指令attr

Question

我有一個問題，在另一個指令中有條件地使用指令，所以讓我說我有一個指令'myGrid'，在它的模板中我有這樣的東西：

<table my-grid-resizable>...</table>

我只想在使用myGrid指令時才使用myGridResizable指令：

<my-grid resizable="true" />

但我不想在myGrid指令的模板內部使用ng-if。

我試過這個：

 if (scope.resizable) {
            angular.element(element).find('table').attr('my-grid-resizable', ''); }

但它不起作用，屬性被添加但指令不起作用，重新編譯指令也沒有幫助。

感謝您幫助解決這個問題

Answer 1

您只是設置屬性，但這並不意味着DOM將自己消化。 您的DOM未更新的原因是您沒有更新任何模型或綁定。 你只是在修改DOM。

所以你必須手動編譯你的元素，比如

首先，在您的指令或控制器中注入$compile （以適用者為准）

然后做：

if (scope.resizable) {
    angular.element(element).find('table').attr('draco-grid-dynamic-table', '');
    var html = angular.element(element).find('table').html();
    var compiledHtml = $compile(html)(scope);
    angular.element(element).find('table').html(compiledHtml);
}

然而，這種方式有效，但不是一種有角度的方式，而且非常氣餒。 我不明白為什么你不想使用ng-if結構。 這是做事的有條理的方式。