typescript - Begär inte data igen efter att ha använt location.back() i Angular 6 - Är ReplaySubject nödvändigt?

Jag använder BehaviourSubject från min tjänst för att få all data från BackEnd som jag prenumererar på i min mainComponent med hjälp av async-pipen.

Om jag nu navigerar till en annan subkomponent och sedan till exempel klickar på en bakåtknapp (använder Location.back()-funktionen) för att återgå till min huvudkomponent hämtar den alltid all data med en ny förfrågan från backend.

Jag antar att detta kommer från att använda async-pipen eftersom den avprenumererar på BehaviourSubject när man lämnar mainComponent.

Behöver jag implementera någon caching-strategi för detta eller kan detta lösas med en ReplaySubject med storleken på all data jag hämtar från mainComponent?

Nedan är min kod:

Service :

private subject$: BehaviorSubject<Setting[]> = new BehaviorSubject<Setting[]>([]);

fetchData() {
  const fetch$: Observable <Setting[]> = this.getSettings().pipe(share());
  fetch$.pipe(
      map(allSettings => this.subject$.next(allSettings))
    );
  return fetch$;
}

Huvudkomponent :

data: Observable<Setting[]>;

// Load Setting while starting
ngOnInit() {
  this.data = this.apiService.fetchData();
}

MainComponent.html:

<tr *ngFor="let s of data | async">
  <!--Do Something...-->
</tr>

Underkomponent :

goBack(): void {
  this.location.back();
}

Stort tack i förväg :)

Svar #1

Allt du har i ngOnInit() kommer att köras när du "kommer tillbaka" till komponenten. Du kan lägga dina data i en variabel i en tjänst och sedan i ngOnInit() kontrollera om det finns några data i tjänsten, och om det gör det, fråga inte efter dem från en server igen.

if(myservice.data) {
do nothing}
else {
myservice.data = this.apiService.fetchData();}