angular - FormArray 和 AsyncValidators（不是 AsyncValicatorFn）

Question

我有一个 FormArray 控件。其主要用例是用户粘贴值列表，应用程序将值拆分一个换行符，然后在 FormArray 中创建所需数量的输入并将值分配给每个输入。用户也可以一个一个地添加控件，手动输入值，但这将是一个罕见的例外，而不是规则。

我想要做的是验证所有粘贴的值与主数据相比是否有效，只需一次调用数组中提供的值的数组的服务器即可。我似乎无法弄清楚如何将 AsyncValidator（不是 AsyncValidatorFn）分配给 FormArray。FormBuilder 只接受 AsyncValidatorFn （或它们的数组）。由于没有为 AsyncValidator 分配指令的元素，我不清楚这应该如何工作。我可以做一些愚蠢的事情，比如将验证器注入到父组件中，然后setValidator在 FormArray 上使用，但这确实看起来很老套。肯定有更好的方法，对吧？

例如，用户粘贴以下内容（想象从 excel 中复制一列值）

1
2
3
4

Angular 应用程序将其拆分为 4 个值，并将每个值分配给它自己在表单数组中的输入。

FormArray AsyncValidator 使用参数 [1,2,3,4] 调用服务器端点，并根据需要从那里生成 ValidationErrors。

标签： angularangular-reactive-forms

Answer 1

我有两个问题：

1. 我挂断了通过FormBuilder而不是指令添加验证器。
2. 我不知道formArrayName指令

我创建了ValuesExistValidatoras 指令并将其添加到<ng-container带有指令的元素中，formControlName因此 angular 可以将其应用于该 FormArray

<ng-container formControlName="lookupvalues" appValuesExistValidator>
  <!-- inputs here -->
</ng-container>

完美运行。