Validators.pattern 的正则表达式仅表示整数
Regex expression with Validators.pattern for just integer number
我正在尝试使用正则表达式为整数(例如 60)创建一个验证器。
这是我的尝试方式:
meter: ["", Validators.required, Validators.pattern(/[0-9]/)]
它不起作用,但我不得不说我不熟悉这种技术。
任何人都可以阐明我如何修改此表达式以仅接受整数?
这个数字代表身高,身高分为米和厘米。
我已经搜索过了,但是我可以找到小数等等,不知何故,也许是因为它太琐碎了,对于整数,我找不到,事实上,我昨天在这里找到了,但我找不到答案anymore I have found, 我正在寻找另一件事。
首先,您不需要自定义验证器来执行此操作,因为正则表达式验证已经是内置验证器。
其次,将验证器应用于表单控件的方式取决于您使用的是 template-driven forms or reactive forms。
如果您使用的是模板驱动的表单(通常用于 Angular 初学者),只需将您的输入控件模板设置为如下所示:
<input type="number" name="meter" required pattern="[0-9]" [(ngModel)]="meter">
如果您使用的是响应式表单,只需将 "required" 和 "pattern" 验证器分配给您的表单控件。
<input type="number" [formControl]="myControl">
myControl = new FormControl(null, [
Validators.required,
Validators.pattern("[0-9]+")
]);
在响应式表单控件中使用时,您可以传入字符串或正则表达式对象,它们之间存在差异,如官方文档所述:
If a string is passed, the ^ character is prepended and the $ character is appended to the provided string (if not already present), and the resulting regular expression is used to test the values.
最后,附上一个 Stackblitz 示例,以显示此验证器在两种 template/reactive 形式中的简单用法。
我正在尝试使用正则表达式为整数(例如 60)创建一个验证器。 这是我的尝试方式:
meter: ["", Validators.required, Validators.pattern(/[0-9]/)]
它不起作用,但我不得不说我不熟悉这种技术。 任何人都可以阐明我如何修改此表达式以仅接受整数? 这个数字代表身高,身高分为米和厘米。
我已经搜索过了,但是我可以找到小数等等,不知何故,也许是因为它太琐碎了,对于整数,我找不到,事实上,我昨天在这里找到了,但我找不到答案anymore I have found, 我正在寻找另一件事。
首先,您不需要自定义验证器来执行此操作,因为正则表达式验证已经是内置验证器。
其次,将验证器应用于表单控件的方式取决于您使用的是 template-driven forms or reactive forms。
如果您使用的是模板驱动的表单(通常用于 Angular 初学者),只需将您的输入控件模板设置为如下所示:
<input type="number" name="meter" required pattern="[0-9]" [(ngModel)]="meter">
如果您使用的是响应式表单,只需将 "required" 和 "pattern" 验证器分配给您的表单控件。
<input type="number" [formControl]="myControl">
myControl = new FormControl(null, [
Validators.required,
Validators.pattern("[0-9]+")
]);
在响应式表单控件中使用时,您可以传入字符串或正则表达式对象,它们之间存在差异,如官方文档所述:
If a string is passed, the ^ character is prepended and the $ character is appended to the provided string (if not already present), and the resulting regular expression is used to test the values.
最后,附上一个 Stackblitz 示例,以显示此验证器在两种 template/reactive 形式中的简单用法。