我尝试通过异步/等待数据库加载来实现加载微调器,但无法在异步方法中命中代码。 我的数据加载看起来像这样
getServerList(){
this.http.get('XXXX')
.map((data : Response) =>{
return data.json() as MyObject[];
}).toPromise().then(x => {
this.serverList = x;
})
}
组件内部的功能是
async () => {
try {
await this.serverListService.getServerList()
}catch{}
}
对,我有个警告告诉我,我的await关键字没有用,因为没有什么可等待的。所以我决定像这样在我的数据加载中添加一个异步关键字
async getServerList(){
this.http.get('http://localhost:6875/api/ServerList_Base')
.map((data : Response) =>{
return data.json() as ServerListBase[];
}).toPromise().then(x => {
return x;
})
return this.serverList
}
所以现在我的等待很有用,但是我的问题是代码从未在异步方括号内击中。我的意思是里面的代码
async () => {}
从未执行过,我也不知道为什么。我试图从构造函数/从ngAfterViewInit的nginit中找到它,但没有任何效果
而且,当我尝试删除此类异步括号时,
async loadDataFromDB(){
await this.serverListService.getServerList()
this.dataSource = new MatTableDataSource()
this.dataSource.paginator = this.paginator;
this.dataSource.sort = this.sort;
this.showSpinner = false;
}
在进入第二行“ this.dataSource”之前,它不会等待getServerList()。 我习惯在C#中使用async / await,也许我错过了一些有关角度的东西。 预先感谢
答案 0 :(得分:1)
您的getServerList
应该看起来像这样
getServerList(): Observabe<MyObject[]>{
return this.http.get('XXXX')
.pipe(
map((data : Response) =>{
return data.json() as MyObject[];
})
);
}
然后您将其消耗掉:
getServerList().subscribe((data: MyObject[]) => {
});
我建议您阅读docs on observables on the angular web page和前面提到的How do I return the response from an asynchronous call?问题。
承诺,异步/等待和可观察对象都是针对同一问题的相似解决方案,但它们的工作方式有所不同。您的代码当前混合了所有这三种代码。有多种方法可以实现上述目标,但我建议您选择其中一种解决方案并坚持使用,而不要混淆使用。混淆它们只会使您的代码混乱。