Question

您可能会在以下链接中找到回复，但它不能回答我的问题

https://stackoverflow.com/questions/38875375/how-to-make-synchronous-http-calls-in-angular-2

我想要的是什么：

在ajax中我们可以通过将其标记为“async：false”来调用服务，因此它将是同步的，我想以这种方式进行我的webservice调用。根据我的下面的代码，它是异步的，如何进行同步调用，就像获取完整值后，我只想执行其他指令。

如何在角度2中进行同步调用，在我的情况下，我有一个调用java服务的函数，并且服务返回一些JSON对象（值列表），通过使用此对象列表进行一些操作和绘制一张桌子。这里一切正常，但是当我的第一次触发器恰好调用webservice来绘制表时，它不会绘制表，因为对象没有返回正确的JSON，但是当我第二次触发动作时它正确显示表中的值。我相信webservice响应正在进行一些延迟，因为调用是异步的，它导致了这个问题。因此，我们如何以这样的方式进行调用，即根据响应JSON正确绘制表。

我的代码如下所示：

组件类型脚本：

 constructor(private service: VolumeHttpService)  {}
          temp: SomePojo[];
          public someFunciton(): void {
             this.service.getTableVal()
              .subscribe(temp=> this.temp= temp);
    //do some manipulations with temp data
        }

服务打字稿：

getTableVal(): Observable<SomePojo[]> {
    return this.http.get<SomePojo[]>(serviceUrlAddress)
      .pipe(
      tap(rowData => '')
      );
  }

Answer 1

您的问题有几种解决方案。您可以将您的http调用转换为承诺，并且只有在您的请求返回结果时才会继续。但可能更好的方法是在渲染内容时在html中使用async管道。

<div *ngFor="let t of temp | async">Name: {{ t?.name }}</div>

假设temp中的对象具有名为name的属性，仅用于示例目的。

否则，您可以在渲染之前验证您的数据是否存在

<div *ngIf="temp"><div *ngFor="let t of temp">Name: {{ t.name }}</div></div>

Angular 2 http同步调用

1 个答案: