Question

我有一个简单的角材料输入字段

<form [formGroup]="parentFG">
  <mat-form-field>
    <input [formControlName]="CALCULATOR_INPUT" matInput placeholder="" autocomplete="off" (keyup)="updateInput($event)">
  </mat-form-field>
</form>

具有仅允许无符号整数的表单控件和验证器

  ngOnInit() {
    let formControl = new FormControl('', UIntValidatorDirective.validateFunc);

    this.parentFG.addControl(this.CALCULATOR_INPUT, formControl);
  }

当输入无效输入时，验证器工作并用红色突出显示输入。但是，我不想让用户首先输入无效的输入。有没有办法禁止将无效字符或字符串放置在输入字段中？

Answer 1

您可以编写regex过滤器函数并添加所需的行为。

基本示例：您可以将其与Rxjs结合使用，以检查每次按键或自定义时间间隔的输入。

    RemoveInvalidString(formInputValue){

        if (!(/^\d+$/.test(formInputValue))) { //unsigned integer?

            console.log("removing input value", formInputValue)

            formInputValue = ''

        }

    }

相关帖子：How to restrict special characters in the input field using angular2/ typescript

如何禁止角形材料输入字段输入错误

1 个答案: