I'm having trouble processing the JSON data received from a server. When I attempt to use .forEach on it, I receive an error stating that the data is undefined even though the console.log shows the correct values.
What could be causing this issue? Is there a missing async/await somewhere in my code? Could it be that I am calling the data processing function too early? If so, how can I resolve it?
Here are some relevant snippets from the component.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);
});
}
Relevant parts of the service:
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 => {
tags.push(tag);
});
return tags;
}
Additionally, here is a screenshot of the console output: https://i.sstatic.net/v57R8.png