當父指令使用templateUrl時，AngularJS子指令不會被調用

Question

我對數據網格初始化代碼有點厭倦，所以我正在嘗試AngularJS的一些新功能。我想說明，像這樣我的數據網格內聯：

<grid src="http://my/web/service" page-size="10"> 
    <column name="one" label="My First Column" /> 
    <column name="two" label="My Second Column" /> 
    <column name="three" label="My Last Column"> 
     <value id="true" label="Yay" /> 
     <value id="false" label="Nay" /> 
    <column> 
</grid> 

基本上，我想配置，方便的XML（非JS）的語義，而不是笨拙的初始化網格。爲此，我創建了三個指令，最外面的指令也有一個模板，它將顯示網格。

問題是：當您爲外部元素配置模板時，內部元素未鏈接（配置網格所需的內部元素）。我也不想跨越內在因素。

問題是：如何訪問網格元素的原始內容？模板元素/元素實例的內容都是模板的內容。

您可以在http://plnkr.co/edit/rb9yyogQEmoLXFhWpl8F

Answer 1

檢查我的代碼，因爲它覆蓋任何內容元素有不能使用的指令定義對象的template或templateUrl性能。

您需要自行添加模板。

.directive("grid", function(){ 
    return { 
     //... 
     link: function(scope, element){ 
     // this assumes that your child directives have registered themselves and 
     // are no longer needed 
     element.empty(); 
     var templateUrl = "grid.html"; 
     element.append("<div ng-include='\"" + templateUrl + "\"'></div>"); 
     $compile(element.contents())(scope); 
     } 
    } 
})