我无法使Angular 5 Validators.pattern正常工作。我已经尝试了应该正常工作的每个正则表达式,但它不起作用。我读到Validators.pattern需要不同的格式,但我似乎无法找到它......
任何想法Validators.pattern应该是什么
(1)只允许数字,正面和负面
和
(2)只允许数字,正数和负数,可选,最多2位小数
有效的例子是: 1 1.2 1.22 -21 -21.48
任何带有任何字母的内容都将无效。
感谢您的帮助!
答案 0 :(得分:9)
尝试了这么多正则表达式后,没有人在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),则不会将其存储在字段控件的值中。它只存储有效值(数字)。所以我只是用存储的值修补值 - 如果它是有效的,有数字,那很好;如果它与其他字符一样无效,那么它将用空字符串替换输入。
适用于所有浏览器。希望这有助于某人:)
答案 1 :(得分:2)
别忘了使用引号和双反斜杠来使您的正则表达式像Validators.pattern('\\-?\\d*\\.?\\d{1,2}')
一样工作,或者您可以为此设置变量
const regexPattern = /\-?\d*\.?\d{1,2}/;
Validators.pattern(regexPattern);
答案 2 :(得分:0)
这在Aungular 7中为我工作
const numericNumberReg= '^-?[0-9]\\d*(\\.\\d{1,2})?$';
this.$form = this.$builder.group({
cost: ['', [Validators.required,Validators.pattern(numericNumberReg)]],
});
答案 3 :(得分:0)
您可以尝试使用此正则表达式'^-?[0-9] \ d *(\。\ d {1,2})?$'。您的表单生成器将如下所示:
this.yourForm= this.formBuilder.group({
amount: [this.amount, [Validators.required, Validators.pattern('^-?[0-9]\\d*(\\.\\d{1,2})?$')]]
});
答案 4 :(得分:0)
仅允许不带符号的整数。
Validators.pattern(/^[0-9]\d*$/)
数字从一个开始
Validators.min(1)