我一直在堅持構建一個大型的AngularJS應用程序內部組件,我一直在維護,我真的很喜歡一些指導,因爲我在我的智慧結束。請多多包涵!是否有可能檢索在另一個指令內編譯的指令的控制器?
語境:
我有一些指示,我想有相互通信。因此,我認爲在每個指令中定義一個控制器以暴露API以供其他指令使用是適當的。現在,我非常瞭解指令中的require
屬性,以及如何使用父指令的控制器。不幸的是,在我目前的情況下,我的指令並不適合使用需要控制器。
而不是使用require
,我所面對的代碼基本上大多選擇將指令直接添加到DOM,然後再編譯它們。我想這是爲了靈活定製指令如何相互依賴。
我已經在示範Plunker的下面添加了link
函數的一個片段,該示例在我創建的示例Plunker的幫助下可視化我正面臨的問題。請注意指令如何被附加到DOM然後被編譯。我儘可能地嘗試創建我實際上正在處理的代碼的簡化版本,因爲我無法發佈它。
link: function(scope, elem) {
scope.data = '...';
var d2Elem = elem.find('li').eq(0);
d2Elem.attr('d2', '');
var input = angular.element('<input type="text" ng-model="data">');
elem.find('li').eq(-1).append(input);
$compile(d2Elem)(scope);
$compile(input)(scope);
// Able to get d1 directive controller
console.log(elem.controller('d1'));
// Not able to get compiled d2 directive controller
console.log(d2Elem.controller('d2'));
// Able to get compiled ng-model directive controller
console.log(input.controller('ngModel'));
}
問:
可能有人請解釋爲什麼我看到我在我的Plunker評論的行爲?爲什麼當我編譯一個我定義的指令(即d2
)時,即使它存在於指令定義中,我也無法訪問它的相應控制器?
巧合的是,我發現在編譯內置的ng-model
指令後,我實際上可以得到它的控制器。
我在思考一個額外的觀點:我描述的過程中,最簡單的方法是管理相互通信的指令嗎?注意到這些指示不必有嚴格的親子關係。
非常感激的一些想法!
這是一個不錯的拍攝 – elaijuh
好的觀察,謝謝。雖然我想知道爲什麼在控制器可用之前有一段延遲。也許這跟'$ compile'調用有關,它不會在完成後立即執行'$ digest'。 – miqid