Within the parent component, I am collecting responses from observables in an array that is then passed to the child component.
parent.component.ts
let categoriesArray = [];
for (let category of listing.categories) {
this._projectService.getCategories().subscribe((data) => {
this.categoriesArray.push(data);
});
}
parent.component.html
<child-comp #childComp [categories]="categoriesArray"></child-comp>
When it comes to the child component, my goal is to trigger a specific function once the for loop with observables in the parent component has completed.
child.component.ts
@Input() public categories;
public limitCategories() {
**//This function should be called by the parent component after all observable calls are done**
...
}
child.component.html
<div class="Category" *ngFor="let item of categories">
...
</div>
I attempted making the categoriesArray an Observable and subscribing to it within the child component, but this would call limitCategories() each time there was a change. My intention is to trigger it only once after the last service call.