如何在角度飛鏢組件中使用* deferredContent指令？

我只注意到了新的角度鏢組件，所以我attemping使用它們這樣：如何在角度飛鏢組件中使用* deferredContent指令？

<material-expansionpanel-set> 
     <material-expansionpanel *ngFor="let place of places" name="{{place.name}}" showSaveCancel="false"> 
     <div *deferredContent>{{place.name}}</div> 
     </material-expansionpanel> 
    </material-expansionpanel-set>

我期待在div裏面的元素被以遞延方式自動地顯示出來。它接縫我不知道它是如何工作的：div內的聲明從不顯示（當然這只是一個測試，我打算把整個組件放在* deferredContent div。

這是在HTML我得到。

<material-expansionpanel-set _ngcontent-toa-2=""> 
     <!--template bindings={}--><material-expansionpanel _ngcontent-toa-2="" showsavecancel="false" _nghost-toa-10=""> 
<div _ngcontent-toa-10="" class="panel themeable open" role="group" aria-label="myplace" aria-expanded="true"> 


    <!--template bindings={}--><header _ngcontent-toa-10="" buttondecorator="" role="button" class="" aria-label="Close myplace panel" tabindex="0" aria-disabled="false"> 
    <div _ngcontent-toa-10="" class="panel-name"> 
     <p _ngcontent-toa-10="" class="primary-text">myplace</p> 
     <!--template bindings={}--> 

    </div> 

    <div _ngcontent-toa-10="" class="panel-description"> 

    </div> 

    <!--template bindings={}--><glyph _ngcontent-toa-10="" buttondecorator="" class="expand-button" role="button" _nghost-toa-11="" tabindex="0" aria-disabled="false"><i _ngcontent-toa-11="" aria-hidden="true" class="material-icons">expand_less</i></glyph> 
    </header> 

    <main _ngcontent-toa-10="" class=""> 
    <div _ngcontent-toa-10="" class="content-wrapper"> 
     <div _ngcontent-toa-10="" class="content"> 

     <!--template bindings={}--> 

     </div> 
     <!--template bindings={}--> 
    </div> 

    <!--template bindings={}--><div _ngcontent-toa-10="" class="toolbelt"> 

    </div> 

    <!--template bindings={}--> 
    </main> 

</div> 
</material-expansionpanel> 
    </material-expansionpanel-set>

如果這個想法是落實DeferredContentAware並獲得通知當組件是可見的，我會很迷惑（因爲我們可以做到這一點手動通過聽來打開和關閉事件）

來源

2017-02-09 Zied Hamdi

material-expansionpanel應自動觸發事件*deferredContent。

一些簡單的問題：

你有你的directives: const [ ...]DeferredContentDirective？
您正在使用哪個版本的AngularDart？

來源

2017-02-24 23:35:04 matanlurey

謝謝您relply，我認爲該指令將由材料expansionpanel組件自動包括（由它怎麼說，該指令不包括在MATERIAL_COMPONENT_DIRECTIVES的方式，將在doc），我用ngIf做了一個手動解決方法，所以我不能告訴你它是否可以通過添加指令我使用最新的角度飛鏢 –

我會將你的答案標記爲正確的，因爲我無法檢查它，我相信這是一個很好的答案 –

如何在角度飛鏢組件中使用* deferredContent指令？

回答

相關問題