是否可以在应用程序组件上使用 [ngClass]，其中该类位于 Angular 6 的组件内部？

我有一个 Angular 6 应用程序，我正在尝试将另一个 CSS 类应用到我的应用程序组件之一app.component.html文件。基本上，我想根据条件更改应用程序页脚的颜色，而所有其他情况都不显示页脚。所以，我的代码如下所示：

应用程序组件.html

<router-outlet></router-outlet>
<my-footer [ngClass]="{ 'my-class' : true }"></my-footer>

我的页脚.css

:host {
    background-color: black;
    color: white;
}

.my-class {
    background-color: red;
}

是否可以使用[ngClass]这样，该类存在于我将条件应用于自身的组件中吗？我发现如果我放.my-class in the app.component.css文件，然后它按预期工作。但是，我希望将我的样式保留在它们所属的组件中。

Thanks!

使用选择器:host.my-class似乎有效，如图所示这次堆栈闪电战 https://stackblitz.com/edit/angular-qghgoc.

我的页脚.css

:host {
    background-color: black;
    color: white;
}

:host.my-class {
    background-color: red;
}

应用程序组件.html

<my-footer [ngClass]="{ 'my-class' : condition }"></my-footer>