Question

我无法使Angular 5 Validators.pattern正常工作。我已经尝试了应该正常工作的每个正则表达式，但它不起作用。我读到Validators.pattern需要不同的格式，但我似乎无法找到它......

任何想法Validators.pattern应该是什么

（1）只允许数字，正面和负面

和

（2）只允许数字，正数和负数，可选，最多2位小数

有效的例子是： 1 1.2 1.22 -21 -21.48

任何带有任何字母的内容都将无效。

感谢您的帮助！

Answer 1

尝试了这么多正则表达式后，没有人在Safari中工作。所以这就是我做的......

首先，我在创建表单控件时使用了正则表达式：

new FormControl({value: field.value}, [Validators.required, Validators.pattern(/^-?(0|[1-9]\d*)?$/)])

然后，在输入中我添加了一个（输入）事件：

<input matInput (input)="validateInput(field)" [placeholder]="field.label" type="number" [formControlName]="field.id" [id]="field.id">

这个功能看起来像这样：

validateInput(field) {

    this.detailForm.patchValue({ [field.id]: this.detailForm.controls[field.id].value }); }

}

如果在Safari中输入无效字符（例如a-z），则不会将其存储在字段控件的值中。它只存储有效值（数字）。所以我只是用存储的值修补值 - 如果它是有效的，有数字，那很好;如果它与其他字符一样无效，那么它将用空字符串替换输入。

适用于所有浏览器。希望这有助于某人：）

Answer 2

别忘了使用引号和双反斜杠来使您的正则表达式像Validators.pattern('\\-?\\d*\\.?\\d{1,2}')一样工作，或者您可以为此设置变量

const regexPattern = /\-?\d*\.?\d{1,2}/;
Validators.pattern(regexPattern);

Answer 3

这在Aungular 7中为我工作

    const numericNumberReg= '^-?[0-9]\\d*(\\.\\d{1,2})?$';

this.$form = this.$builder.group({
      cost: ['', [Validators.required,Validators.pattern(numericNumberReg)]],
    });

Answer 4

您可以尝试使用此正则表达式'^-？[0-9] \ d *（\。\ d {1,2}）？$'。您的表单生成器将如下所示：

 this.yourForm= this.formBuilder.group({
      amount: [this.amount, [Validators.required, Validators.pattern('^-?[0-9]\\d*(\\.\\d{1,2})?$')]]
});

Answer 5

仅允许不带符号的整数。

Validators.pattern(/^[0-9]\d*$/)

数字从一个开始

Validators.min(1)

仅限数字的Angular 5 Validators.pattern正则表达式

5 个答案: