内置指令不适用于根组件

在我的应用中，根组件是 app-root。当我设置像

这样的属性绑定时

<body>
    <app-root [style.display]="'none'"></app-root>
</body>

绑定被忽略。我的终端或控制台都没有错误。同样的情况发生在

<body>
    <app-root [ngClass]="'someClass'"></app-root>
</body>

这些可以很好地与其他嵌套组件配合使用，例如

<head-comp [ngClass]="'someClass'"></head-comp>

但不是我的根组件。

我多次尝试重新启动服务器并刷新页面，但问题仍然存在。

首先，这不是在标签中写一个单词的正确方法，因为它表现为模板指令，或者你可以说空框由 app.component.html 内容填充，

问题可能是主元素不是您要应用样式的组件的一部分

您可以添加它，它应该正确定位该组件。

:host {
    width: 100%;
    height: 100%;
}

:host 用于寻址宿主元素（例如）。

你可以这样实现：

export class AppComponent {
  @HostBinding('class') get class() {
    if (false) {
      return 'do not hide';
    }
    return 'hide';
  }

:host.hide {
  display: none;
}