Angular 4 在 angular-cli 中切换样式表

Question

我想知道是否可以切换主题（2 个样式表）。 我的实际配置是我的 angular-cli.json 配置中的样式表 A。 我想做的是用一个简单的（单击）切换器将样式表 A 替换为样式表 B。

如果我在 index.html 中导入样式表，代码将如下所示

组件：

constructor() { }

  toggleTheme() {
    this.darkTheme = this.lightTheme;
  }

索引.html

<div [class.dark]="darkTheme">
<div [class.light]="lightTheme">
<button (click)="toggleTheme()">
Toggle theme
</button>

但是由于我在 angular-cli.json 文件而不是 index.html 中导入样式表 dark.css，我该如何解决这个问题？

Answer 1

在 Angular 中，每个组件都有自己的样式表文件，并且范围仅适用于组件。我认为您想更改索引文件中的主样式表，但自 Angular 组件以来，它没有要更改的上下文或范围。

您可以在主组件中执行此操作（作为共享布局）。但请记住，任何子组件都不具有样式表范围。