Angular 我的验证器收到一个始终为空的可观察值

AsyncValidator的方法在您的情况下效果很好.您可以将验证器函数转换为如下所示:

export function checkIdUniqueValidator(
  existingValues$: Observable<RowData[]>
): AsyncValidatorFn {
  return (control: AbstractControl) =>
    existingValues$.pipe(
      map((rowDataList) => rowDataList.map((rd) => rd.id)),
      map((existingValues) =>
        existingValues.includes(control.value)
          ? { duplicate: { value: control.value } }
          : null
      ),
      first()
    );
}

然后为了使用它，您应该使用FormControl构造函数来传递它，如下所示:

this.myForm = this.formBuilder.group({
  id: new FormControl('', {
    validators: [Validators.required],
    asyncValidators: [checkIdUniqueValidator(this.valuesSource$)]
  })
});

this.valuesSource$个可观察值实际上应该是某种类型的Subject，这样每当values数组更改时(当您将push放入其中或从中移除元素时)，您就可以发出新值.

values: RowData[] = []; // The values array which is regularly updated
valuesSource$ = new BehaviorSubject(this.values);

如果你这样放着，它不会被更新.您的可观察对象只会发出一次空数组，仅此而已.除非您在每次修改this.values数组时调用this.valuesSource$.next(this.values);，否则您永远不会有已经使用过的ID.

我模拟了带有超时的this.values数组的更新，它似乎如预期的那样工作.

ngOnInit(): void {
  setTimeout(() => {
    this.values.push({ id: '1' });
    this.values.push({ id: '2' });
    this.values.push({ id: '3' });
    this.valuesSource$.next(this.values);
  }, 3000);
}