typescript Angular 15-等到我从ngOnInit上的API调用中接收到数据,然后调用ngAfterViewInit

ql3eal8s  于 2023-05-08  发布在  TypeScript
关注(0)|答案(1)|浏览(159)

我在ngOnInit上做了一个下面的API调用,我想在调用ngAfterViewInit事件之前强制它等待直到数据返回到Dto,因为我正在对那里的数据进行操作。因此,它不会等待并移动到ngAfterViewInit,在那里我的Dto是未定义的,然后回到ngOnInit订阅加载,我不想要的。任何帮助感激不尽。

this.subscriptions.add(
  this.gridService
    .GetGridByName(
      this.gridName,          
      '1.0'
    )
    .subscribe({
      next: (data: any) => {
        if (data.result) {
          // should wait for this dto to load before hitting to ngAfterViewInit 
          this.gridDto = data.result;              
        }
      },
5lhxktic

5lhxktic1#

你已经有了一个观察对象。你就待在观察的世界里,直到有你想要的副作用。

gridDto$: Onservable<any>;

ngOnInit() {
  ...
  this.gridDto$ = this.gridService.GetGridByName(
    this.gridName,          
    '1.0'
  )
  .pipe(
    map(data => data?.result),
    // if nothing returned, don't emit anything.
    filter(result => !!result),
    // don't repeat instructions per listener
    shareReplay(1)
  );
}

如果您的网格组件接受可观测值,则将其改为gridDto$。否则,将模板中的gridDto更改为gridDto | async,以便Angular知道它是一个可观察对象。
现在您已经将数据作为一个observable获取,您可以在ngAfterViewInit脚本中通过管道或订阅它。

相关问题