是否可以在角度2中进行条件内容投影(包含)

前端之家收集整理的这篇文章主要介绍了是否可以在角度2中进行条件内容投影(包含)前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我想提供仅在内容未被转换时才会出现的默认内容.

例如,这是我的组件模板:

<article>
    <header>
        <ng-content select="[header]"></ng-content>
    </header>
    <section>
        <ng-content></ng-content>
    </section>
</article>

我可以像这样使用它:

<my-component>
    <h1 header>This is my header</h1>
    <p>This is my content</p>
</my-component>

现在如果我想提供默认标头怎么办?可能吗;没有杂技,比如检查ngAfterContentInit中的内容

你可以用纯CSS做到这一点!
想象一下,你有以下几点
<ng-content select=".header"></ng-content>
<h1 class="default-header">
     This is my default header
</h1>

如果提供了内容,则以下CSS将隐藏标题

.header + .default-header {
    display: none;
}

如果未提供标头,则不匹配display:none规则.

注意,您必须关闭内容封装才能使用它:encapsulation:ViewEncapsulation.None

原文链接:https://www.f2er.com/angularjs/141217.html

猜你在找的Angularjs相关文章