我尝试处理从服务器获得的json数据,但当我尝试执行.forEach时,它显示我尝试使用的数据未定义,而console.log显示正确的值。
可能是什么问题,我错过了一个异步/等待从某处?我调用数据处理函数太早?如果是的话,它是如何解决的?
组件的相关部分。ts:
all: any;
constructor(private feedService: FeedService) { }
ngOnInit(): void {
this.fetchPosts();
console.log(this.all);
}
ngAfterContentInit() {
this.feedService.getTags(this.all.posts[0]);
}
async fetchPosts() {
(await this.feedService.getJSON(this.url)).subscribe((data) => {
console.log(data);
this.all = data;
console.log(this.all);
});
}
服务的相关部分:
constructor(private http: HttpClient) {
}
public async getJSON(url: string) {
return this.http.get<any>(url);
}
public async getTags(postData: any) {
let tags = [];
await postData['tags'].array.forEach(tag => { //This throws the error
tags.push(tag); //Uncomplete processign code, for now it
});
return tags;
}
下面是控制台输出的屏幕截图:
3条答案
按热度按时间ffscu2ro1#
add
this.all?.posts[0]
我认为问题是this.all是任何类型。当this.all为null或未定义时,this.all.posts无法读取,因为它将尝试读取 undefined.posts,这是不可能的lnxxn5zx2#
当您尝试访问“ngAfterContentInit”函数中的“this.all.posts[0]”时,“this.all”变量仍未设置,未定义。对此问题有不同的解决方案。其中之一是您可以在设置“this.all = data;“
x0fgdtte3#
在定义
this.all
之前,使用this.all.posts[0]
呼叫this.feedService.getTags
。fetchPosts
调用的响应在调用完成后的某个时刻被赋值给this.all
,因为它是来自服务器的异步响应,所以你不能相信它会在任何时刻返回,即使afterContentInit
钩子触发了。您需要做的是等待
fetchPosts
中的订阅命中并返回数据。