angular - angular2 formGroup 的唯一值验证器

Question

我正在使用角度反应式 formsGroup 和 formControl。我的要求是每个 formControl 的值应该是唯一的，如果用户尝试添加重复值，那么它应该显示验证错误。

表单组创建

 this.contryCodeForm = this.formBuilder.group({
            US: ['+1', , [],[this.uniqueValidator, Validators.required]],
            UK: ['+44',  [],[this.uniqueValidator, Validators.required]],
            India: ['+91', [],[this.uniqueValidator, Validators.required]],
            email: ['+61', [],[this.uniqueValidator, Validators.required]]
        });]

如果有人尝试编辑其他国家/地区已采用的值，我想添加验证。

我试图实现 this.uniqueValidator

const values = Object.keys(formGroup.value).map(key => formGroup.value[key])

const filtered = values.filter(x=>x === control.value); 
if (filtered.length > 1) {
return {message: "This field must be unique value"}
}

但它不起作用

任何帮助表示赞赏

Answer 1

我认为你应该这样做：

1. 创建验证器，它采用 formGroup

export class MyOwnValidator {
    
    static checkDuplicates(formGroup: FormGroup): ValidationErrors | null {
        //here you can get access to all controls 
          and implement the logic for checking duplicates
    }
}

2. 在 formGroup 中添加这个验证器

this.contryCodeForm = this.formBuilder.group({
            US: ['+1', , [],[ Validators.required]],
            UK: ['+44',  [],[ Validators.required]],
            India: ['+91', [],[Validators.required]],
            email: ['+61', [],[Validators.required]]
        }, , {
            validators: MyOwnValidator.checkDuplicates
        })