Anglular Transclude從子指令

Question

我有，我用它來渲染引導面板指示，我用transclude讓我呈現的自定義內容如

<tn-Panel class="ng-cloak" title="'My Things'" > 
    <tn-Thing> 
    </tn-Thing> 
</tn-Panel> 

的TN面板呈現的標題頭和將指令放置在內部。

我希望能夠呈現正文中的內容和頁腳中的其他內容。

下普拉克顯示了這個

https://plnkr.co/edit/j8U8MZlVSQCFB7RkpwOY?p=preview

但是，它並沒有呈現從內容和頭位

<pane title="Nested"> 
    <panenested></panenested> <-- does not following the transclude 
    </pane> 

Answer 1

更新您的指令

.directive('pane', function(){ 
    return { 
    restrict: 'E', 
    transclude: { 
     'content': '?content', 
     'footer': '?footer', 
     'panenested':'?panenested', 
    }, 
    scope: { title:'@' }, 
    template: '<div style="border: 1px solid black;">' + 
       '<div style="background-color: gray">{{title}}</div>' + 
       'Content : <br> <ng-transclude ng-transclude="content"></ng-transclude> <br>' + 
       'Footer : <br> <ng-transclude ng-transclude="footer"></ng-transclude> <br>' 
       +'<br> <ng-transclude ng-transclude="panenested"></ng-transclude> <br>'+ 
       '</div>' 
    };