首页 > 解决方案 > 在 Angular 表单验证器中使用变量

问题描述

我正在尝试在我的 Angular 应用程序的表单验证器中使用变量或枚举。例如,而不是

TestValue: ['', [Validators.min(0), Validators.max(72)]];

将数字硬编码后,我想在 Validators 参数中传入一个枚举或一个变量,该参数将具有这些数字值,以便我可以跨组件使用它们。

这可能吗?

标签: javascriptarraysangularformsvalidation

解决方案


坎普。是的,您可以设置变量值来验证表单。请务必使用以下代码:

在组件文件中:

form: FormGroup;
min;
max;
constructor(private fb: FormBuilder) {
    this.min = 0;
    this.max = 72;
    this.createForm(this.min, this.max);
}

createForm(min, max) {
    this.form = this.fb.group({
        capacity: ['', [Validators.min(min), Validators.max(max)]],
    });
}

submit() {
    console.log(this.form.value);
    console.log(this.form.controls['capacity'].errors);
}

在您的 HTML 文件中

<form [formGroup]="form" (ngSubmit)="submit()">
    <input type="number" formControlName="capacity" name="capacity" />
    <button>Submit</button>      
</form>

我希望这将帮助您找到预期的解决方案。谢谢你。


推荐阅读