Question

有没有办法将角度材质主题中使用的主要颜色检索到角度项目的css文件中？

在项目中，我们可以在* .scss文件中定义主要颜色，如下所示：

@import '~@angular/material/theming';

@include mat-core();

$primary: mat-palette($mat-green, 800);
$accent:  mat-palette($mat-teal, 600, A100, A400);
$warn:    mat-palette($mat-red, 600);

$theme:   mat-light-theme($primary, $accent, $warn);

@include angular-material-theme($theme);

我尝试在我的组件中使用* .scss文件，但$primary变量无法识别：

//*.scss file
//...
.myclass {
  background: $primary; //This line compiles with the error 'Undefined variable: "$primary".'

}

Answer 1

要首先使用该变量，必须先定义它。根据定义和最终更改的位置（框架通常具有某种设置或类似），您需要@import那些。

但是，通常使用scss的方法是使用一个主文件（name.scss）和多个导入文件（_name.scss）。然后将编译为单个css文件。扩展这些规则的方法是在主文件的末尾（或标记点）添加它们。如果你创建一个单独的“主”文件（因此也就是css文件），你可能会有重复的css，即使没有，它仍然是不切实际的。

此外，您可能希望使用mat-color($theme)

在项目的样式表中检索主要颜色

1 个答案: