同步方法角2答案

【问题标题】：synchronous method angular 2同步方法角2
【发布时间】：2018-02-28 09:34:12
【问题描述】：

我在网格中有一个单元格，其中包含每个公司的用户数，这个数字来自打字稿方法 getNumberOfUsers() ，这个方法调用后端 Web 服务返回用户数。问题：所有单元格显示为 0，尽管 getNumberOfUsers() 在控制台中打印用户数

 <tr>
   <td>
     {{ getNumberOfUsers() }}
   </td>
 </tr>

组件 ts 文件

getNumberOfUsers(): number {
  let NumUser=0;
  this.callServices.getUserCount().subscribe((res: any) => {
    NumUser = JSON.parse(res._body).numberOfUser;
    Console.log(“NumUser=”+ NumUser)
  },
    (err) => console.error(' getUserCount::err==' + err)
  );

  return NumUser;
}

调用服务文件

getUserCount(): Observable<any> {
  return this.http.post(this.apiUrl+'/ getUserCount);
}

我想做同步方法

【问题讨论】：

标签： angular typescript angular2-services angular2-directives

【解决方案1】：

异步方法不能以同步方式工作。推荐你阅读How does JavaScript handle AJAX responses in the background?

在这种情况下，您可以考虑使用 async 管道来显示由异步性质填充的值。

更改您的工厂方法以从中返回 json。

getUserCount ():Observable<any>
{
    return this.http.post(this.apiUrl+'/ getUserCount).map(data => data.json())
}

//change getNumberOfUsers to return getUserCount Observable 
getNumberOfUsers(): Observable<any>{
    this.callServices.getUserCount();
}

HTML

{{ (getNumberOfUsers() | async)?. numberOfUser}}

【讨论】：