Question

我想从默认的角度材质颜色方案更改为自定义颜色方案。我的问题是，当我这样做时，MatInput字段在聚焦时停止显示闪烁的光标。我想知道如何将其恢复为单击时显示的闪烁状态。

theme.scss

@import '~@angular/material/theming';
@include mat-core();

$my-app-primary: mat-palette($mat-grey, 100);
$my-app-accent:  mat-palette($mat-blue, 200);
$my-app-warn:    mat-palette($mat-deep-orange);
$my-app-theme: mat-light-theme($my-app-primary, $my-app-accent, $my-app-warn);
@include angular-material-theme($my-app-theme);

custody.component.html

 <mat-form-field>
      <input
        matInput
        type="email"
        formControlName="email"
        placeholder="{{ email }}"
        style="outline: none"
      />
      <mat-error *ngIf="form.get('email').invalid"
        >Please enter a valid email.</mat-error
      >
    </mat-form-field>

Answer 1

“角度材料设计”可与用于主色，强调色（又称辅助色）和警告色的调色板配合使用。这些是您可以在自定义主题中定义的调色板。每个调色板都有代表不同色调的一系列颜色变化（用数字表示，“ A”后跟数字，或者简称为“较暗”或“较浅”）。

因此，让我们直接说一下：您为原色选择的颜色变量是：

$my-app-primary: mat-palette($mat-grey, 100);

原色在Angular Material组件中使用很多，对于matInput也是如此。您选择的变体（100）太浅，因为数字给出的颜色范围从50（较浅）到900（较暗），因此您可能不会在屏幕上看到它。选择其他变体并测试它们是否为您提供所需的颜色。

有关“角度材料”上的调色板和设计颜色的更多信息，请参见：https://material.io/design/color/#color-usage-palettes

从默认主题更改为自定义主题会从MatInput，Angular 6中删除光标

1 个答案: