Angular 4/5 : on navigating same page api calls increases

Question

I have kept api calls on ngOnInit() in my pages.

I have page A and Page B and in page AI have kept API getAData and in page BI have kept API getBData.

when i navigate between A and B and then API calls are increases.

for example If i can 3 times by navigating without reload then it will call API 3 time if 4 then it call 4 times

is there anyone can give me solution?

Answer 1

Assuming you subscribe to those calls, you need to unsubscribe from them in ngOnDestroy. The simplest way is to make a subscriptions array using rxjs/Subscription and in ngOnDestroy you can unsubscribe like this:

this.subscriptions.forEach(sub => sub.unsubscribe());