我刚刚注意到了新的角镖组件,所以我试图以这种方式使用它们:
<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中。< / p>
这是我得到的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并在组件可见时得到通知,我会被欺骗(因为我们可以通过监听打开和关闭事件来手动完成)
答案 0 :(得分:2)
material-expansionpanel
应自动触发*deferredContent
的事件。
一些简单的问题:
您的DeferredContentDirective
中有directives: const [ ...]
吗?
您使用的是哪种版本的AngularDart?