Javascript 角度异步验证器-处理响应数据

我正在努力使用angulars异步验证器

我创建了一个异步验证器，用于检查文章编号是否存在。该服务返回一个响应对象，包括关于我的文章的详细信息

目前，我正在尝试实现容器/表示组件体系结构。我的表单应该只从容器组件接收异步验证器

我的问题是，我的表格的一部分只显示在物品编号的验证有效的情况下。应用程序的其余部分填充了来自异步验证响应的数据

当在我的呈现组件中使用逻辑时，这是可行的，但我认为这不是正确的方法。 如果我通过属性绑定将数据提供给我的表示组件，并在容器组件内接收异步验证的数据，那就更好了

这条路对吗？如果是，怎么走？或者我应该只为异步验证创建一个请求，并在字段有效后单独获取数据吗

当前我的验证器如下所示：

专用checkArticle验证程序(
ctrl:AbstractControl
)：可见{
返回此.ps.getArticle（+ctrl.value）.pipe(
点击（d=>this.article=+d.Data.Artikel），
映射（（）=>null），
catchError（e=>of（{ArticlenError:e}））
);
}

在我的演示组件中使用，就像这样

articleNr:[
'',
[Validators.required，Validators.pattern（/^（[0-9]{5}）$/）]，
this.checkArticleNrValidator.bind（this）
理论上的表现成分用于接收（@输入）和
显示数据/触发事件（@Output）

因此，在您的情况下，我会将“CheckArticlenValidator”逻辑移到表示组件之外，例如在容器中（如果这导致容器和表示组件之间存在循环依赖，只需将其移到一个新的ts文件（如blabla.validators.ts）中，并在导出函数中实现该逻辑）

PS：我猜您的PS变量是一个服务。我们称它为psservice。

export function checkArticleNrValidator(ps: PService): AsyncValidatorFn {
   return (control: AbstractControl): Observable<ValidationErrors | null> => {
      return ps.getArticle(control.value)
             .pipe(
                 tap(d => this.article = +d.Data.Artikel),
                 map(() => null),
                 catchError(e => of({ articleNrError: e}))
             );
   }
}

导出函数checkArticleNrValidator（ps:PService）：AsyncValidator fn{
返回（控件：AbstractControl）：可观察=>{
返回ps.getArticle（control.value）
.烟斗(
点击（d=>this.article=+d.Data.Artikel），
映射（（）=>null），
catchError（e=>of（{ArticlenError:e}））
);
}
}
对，这是我的缩进。为了澄清，可以调用tap并提取数据？好的，您可以点击它、订阅或直接返回可观察的数据……这取决于逻辑中接下来的内容……例如，如果您想将返回的值直接显示到视图中，我建议您返回可观察的和参考的数据在视图中删除该变量，如：myVariable | async