[英]Dynamic Tab content rendering
I'm developing tabs component and I want Angular to render and initialize only active tab instead of all tabs. 我正在开发选项卡组件,我希望Angular仅渲染和初始化活动选项卡,而不初始化所有选项卡。 How can it be done?
如何做呢?
<my-tabs>
<my-tab [tabTitle]="'Tab1'">
<some-component></some-component>
</my-tab>
<my-tab [tabTitle]="'Tab2'">
<some-component2></some-component2>
</my-tabs>
Basicaly In this case the first tub is active, so <some-component></some-component>
should be initialized, but <some-component2></some-component2>
shouldn't as Tab2 is not active Basicaly在这种情况下,第一桶是活动的,所以
<some-component></some-component>
应该初始化,但<some-component2></some-component2>
不应该作为TAB2不活跃
Use *ngIf
on the component. 在组件上使用
*ngIf
。 When the value if false, the component will be removed from the DOM, and therefore not initialised. 如果该值为false,则将从DOM中删除该组件,因此不进行初始化。 Something roughly like:
大致类似于:
<my-tab [tabTitle]="'Tab1'">
<some-component *ngIf="tabOneActive" ></some-component>
</my-tab>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.