angular - 如何将额外的参数传递给 Angular 中的异步验证器(响应式(Reactive)表单)？

Question

我有以下异步验证器。如果我想将它用于 react 形式，我必须将它作为第三个参数传递

slug: [null, [Validators.required], [CustomValidators.slug]],

如何将额外的参数传递给验证器？

import {FormControl} from "@angular/forms";

interface IValidation {
    [key: string]: boolean;
}

export class CustomValidators {

static slug(control: FormControl) {
    const q = new Promise<IValidation>((resolve, reject) => {
        setTimeout(() => {
            if (control.value === 'TEST') {
                resolve({'duplicated': true});
            } else {
                resolve(null);
            }
        }, 1000);
    });
    return q;
}
}

如果我将它用作

slug: [null, [Validators.required], [CustomValidators.slug('string param')]],

问题是第一个参数是控件。

Answer 1

像这样写你的验证:

static slug(param: string) {
  return (control: FormControl) => {
    const q = new Promise<IValidation>((resolve, reject) => {
      setTimeout(() => {
        if (control.value === 'TEST') {
          resolve({'duplicated': true});
        } else {
          resolve(null);
        }
      }, 1000);
    });
    return q;
  };
}