如何验证输入字段仅采用 Angular 中的颜色值 6

Question

我正在使用 MEAN Stack 和 Angular 6 实现一个网络应用程序。我有一个输入字段，它从 ngx-colorpicker 获取颜色值。但是这些输入字段也允许我进行文本输入。如果我使用 <input type= 'color'> 然后它会打开一个单独的颜色选择器，如果我 select 一种颜色它只适用于文本字段的中间部分。我想要的是防止在这些输入字段中输入文本或数字。有人有想法吗？

这是我的输入框。

<input type="text" nbInput [(colorPicker)]="colorRangeTraceArc" [cpPosition]="'right'" [cpOutputFormat]="'rgba'[style.background]="colorRangeTraceArc"
    formControlName="colorRTC" name="colorRangeTraceArc" style="width: 100px" (colorPickerChange)="onChangeColorRTA($event)" />

Answer 1

尝试在文本框上使用 keydown 事件来阻止文本框中的任何输入。

这是 HTML 代码：

(keydown)="keyDown($event)"

这是 TS 代码：

 keyDown(event:any){
    return false;
  }

请检查 stackbliz example 中的第一个文本框。

如何验证输入字段仅采用 Angular 中的颜色值 6

How to validate input fields to take only color values in Angular 6

html

mean-stack

angular