Angular - 将类应用于组件根元素而非选择器

Question

我的应用中有一个卡组件。基于什么类型的卡，存在需要应用于模板的根元素的不同样式。当我这样做时：

<card class="card-type-class"></card>

我的HTML最终看起来像这样：

<card class="card-type-class">
    <div class="other-constant-classes">
        content of my card
    </div>
</card>

而不是这样：

<card>
    <div class="other-constant-classes card-type-class">
        content of my card
    </div>
</card>

是否有将选择器中的类应用于组件模板的根元素？

***对不起，如果有人询问，我很难搞清楚如何搜索这个问题......

Answer 1

您始终可以将该类作为字符串传递：

<card [myClass]="'card-type-class'"></card>

然后在下面的组件中：

@Input() myClass: string;

HTML：

<div class="other-constant-classes {{myClass}}">
    content of my card
</div>