3 回答

TA貢獻1906條經驗 獲得超3個贊
usingsetTimeout 不是一個理想的解決方案,您可以直接在訂閱回調函數中更新您的組件變量,并在您的模板中做任何您想做的事情??次业睦?/p>
getItems() {
this.apollo
.watchQuery({
query: this.getItemsQuery,
})
.valueChanges.subscribe((result: any) => {
this.items = result?.data?.items;
});
}
并在模板中
<mat-option *ngFor="let item of items" [value]="item.price">
{{ item.name }}
</mat-option>

TA貢獻1803條經驗 獲得超3個贊
也許不是理想的解決方案,所以我仍然愿意嘗試其他事情,但我能夠通過在服務中使用帶有計時器的承諾,然后在組件中使用異步等待來獲取組件中設置的值。
服務
getUsers(): any {
return new Promise((resolve, reject) => {
let me = this;
this.apollo.watchQuery<any>({
query: USER_SEARCH
})
.valueChanges
.subscribe(({ data, loading }) => {
this.loading = loading;
this.users = data.search;
});
setTimeout( function() {
if(me.users !== 'undefined'){
resolve(me.users)
}
}, 1000)
})
}
成分
async getUsers(): Promise<any> {
this.users = await this.userService.getUsers();
console.log(this.users);
}
這允許從服務中設置 this.users。據我所知,當 Angular 開始設置值時,Apollo 仍在運行查詢,導致值最初顯示為未定義,但我的服務在控制臺中具有來自查詢的值。不確定 Apollo 或 Angular 是否有更好的方法來解決這個問題,但如果有的話,我很想聽聽。
添加回答
舉報