Question

我正在尝试通过API调用来实现页面源等待

    public responseTop: Observable<any>;
    this.responseTop = this.productSRV.topEquipments();
    this.responseTop.toPromise().then(sucess => {
        this.topEquipments = sucess['data'];
        // console.log('eq');
        // console.log(this.topEquipments);
        this.newsletterForm.controls.recaptchaReactive.setValue(sucess['message']);
      }).catch(error => {
        console.log('Error!', error);
    });

  <ng-container *ngFor="let topEq of topEquipments;">

API调用了两次，以及如何放置|异步等待页面源的SEO 如果我放

  <ng-container *ngIf="responseTop | async">

仍然不会在页面源代码中加载

Answer 1

第一次调用.then会执行一次，当您使用async时会第二次执行。

问题是-期望的行为是什么？

我建议将它们组合在一起

public responseTop: Observable<any>;
this.responseTop = this.productSRV.topEquipments().pipe(
  // side effect
  tap(success => this.newsletterForm.controls.recaptchaReactive.setValue(success['message'])),   

  // mapping result to the array we need
  tap(console.log),
  map(success => success['data']),

  // catching error
  catchError(error => {
    console.log('Error!', error);
    throw error;
  }),
);

<ng-container *ngIf="responseTop | async as topEquipments">
  <ng-container *ngFor="let topEq of topEquipments">
    {{ topEq | json }}
  </ng-container> 
</ng-container>

在角度7可观察的异步管道上需要帮助

1 个答案: