Angular 使用 ng-content 类不适用

问题描述

我有一个应用程序，其中有一个布局。在这个布局中，我有一个包含 2 ng-content 的 div。我的问题是我的课程不适用

<div class="col-12 pr-1 pl-0 row m-0 p-0">
    <ng-content class="col-6 mr-0 pr-3 pl-0" select=".content-last-name"></ng-content>
    <ng-content class="col-6 m-0 p-0" select=".content-first-name"></ng-content>
</div>

有什么问题

解决方法

ng-content 标签实际上不会在 DOM 中呈现，它们只是角度特定的语法。所以你在那里添加的类只是“丢失”了。作为一种解决方法，您可以用另一个标签将 ng-content 标签括起来，并向它们添加类。

<div class="col-12 pr-1 pl-0 row m-0 p-0">
    <section class="col-6 mr-0 pr-3 pl-0">
        <ng-content select=".content-last-name"></ng-content>
    </section>
    <section class="col-6 m-0 p-0">
        <ng-content select=".content-first-name"></ng-content>
    </section>
</div>