I'm facing an issue with the async pipe in my view as it's not loading any data dynamically.
On my page, I need to change observable values multiple times such as reloading the page, loading more values, and updating news content based on different categories of news.
Despite trying ChangeDetectorRef and detectChanges(), I'm still unable to get it working.
ngOnInit() {
if (this.isFirstRun) {
this.items$ = this.apiService.getNewsByCategory(
this.categoryId = (this.categoryId === 0 ? 1 : this.categoryId));
this.cg.detectChanges();
}
}
//NgOnChanges
ngOnChanges(changes: SimpleChanges) {
if (this.isFirstRun) {
const chg = changes.categoryId;
this.items$ = this.apiService.getNewsByCategory(chg.currentValue);
this.cg.detectChanges();
}
}
// In the views i used these things
<div *ngIf="(items$| async) as news ; else loading">
// View stuff here
</div>
The items$ should reload whenever there is a change detected, specifically when the CategoryId changes. Unfortunately, it's not functioning correctly in this scenario.
Surprisingly, ngOnInit is working without any issues.
I would greatly appreciate any assistance as I'm currently drawing a blank on finding a solution.