Angular Material Input 没有带有深色主题的白色文本答案

【问题标题】：Angular Material Input does not have white text with dark themeAngular Material Input 没有带有深色主题的白色文本
【发布时间】：2019-02-08 18:23:26
【问题描述】：

目前，我正在尝试使用 Angular 材质的深色主题。我遇到的问题是 matInput 颜色仍然是黑色。我将mat-form-field 的颜色设置为主要颜色。我仍在学习如何实现这些自定义主题，所以我可能没有正确理解它。我可以看到检查器中的currentColor 变量是black。请注意，我不会覆盖项目中任何地方的颜色。我现在拥有最多的 CSS 是自定义主题。

我也不想从我的 sass 中设置颜色，我希望它自动使用主题前景色。

这是我的自定义主题 sass：

@import '../node_modules/@angular/material/theming';

@include mat-core();

$md-skyblue: (
    50 : #e5f2fd,
    100 : #bfdefb,
    200 : #95c8f8,
    300 : #6ab1f5,
    400 : #4aa1f2,
    500 : #2a90f0,
    600 : #2588ee,
    700 : #1f7dec,
    800 : #1973e9,
    900 : #0f61e5,
    A100 : #ffffff,
    A200 : #dee9ff,
    A400 : #abc8ff,
    A700 : #91b7ff,
    contrast: (
        50 : #000000,
        100 : #000000,
        200 : #000000,
        300 : #000000,
        400 : #000000,
        500 : #ffffff,
        600 : #ffffff,
        700 : #ffffff,
        800 : #ffffff,
        900 : #ffffff,
        A100 : #000000,
        A200 : #000000,
        A400 : #000000,
        A700 : #000000,
    )
);

$dark-primary: mat-palette($md-skyblue, 700, 500, 900);
$dark-accent:  mat-palette($mat-blue-grey, A200, A100, A400);
$dark-warn:    mat-palette($mat-deep-orange);

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

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

$background: map-get($dark-theme, background);

body {
    background-color: mat-color($background, background);
}

谢谢！

编辑：这是截图：

【问题讨论】：

嗨，奥普赛克鲁斯！欢迎来到 StackOverflow！您能否附上您当前遇到的问题的屏幕截图？另外，请注意您应该使用@import '~@angular/material/theming; 而不是@import '../node_modules/@angular/material/theming';（如果您使用的是Angular CLI）。最后，请注意，您可以通过将mat-app-background 类应用于body 元素来设置背景颜色。（请注意，如果您使用的是 sidenav，这应该已经为您完成了。）
感谢您的提示！我现在附上截图。第一个你可以看到表单域中的文本是白色的。我发现如果我把mat-form-field 放在mat-card 中，输入文本是白色的。例如，如果我将mat-form-field 放在一个普通的 div 中，即使知道我使用的是深色主题，输入文本也是黑色的。 @edric

标签： angular sass angular-material2

【解决方案1】：

更新 -

我这几天才第一次打开它，现在它在mat-form-field 中显示文本为白色。这可能只是侥幸，通过重建和服务应用程序，这一次它以某种方式修复了自己。这很奇怪，因为当我最初发布此内容时，我一直在运行ng s 来重建应用程序，而输入中的文本颜色仍然是黑色。

谢谢！

【讨论】：