My component doesn't update when on a new page

[slender basin]

I have this : ```ts
this.auditLog$ = this._monitoringService.getAuditLog(this.task.value.id);

```html
     <audit-log fxFlex="calc(35% - 10px)" *ngIf="(auditLog$ | async); let log" [auditLogs]="auditLog$"></audit-log>

When I go to a new page using the search bar, this component doesn't reload. Do I need like a targetChange?

[jaunty plover]

Hard to say without some more context here but http.get is only going to fire when returned observable subscribed to. The | async is 1 and then its possible internally to <audit-log> 2x subscriptions are being setup.

https://angular.io/guide/http#starting-the-request

Or if the parent component to that html snippet is being rendered multiple times

[slender basin]

Got it fixed with shareReplay(1)

[jaunty plover]

Be careful of possible memory leak though, if there are other subscribers out there that aren't immediately visible the shareReplay saves you a HTTP request but doesnt solve possible leak. (the | async sub will be auto cleaned up by ng)

[ornate sandal]

This code doesn't make much sense to me. Either the parent component subscribes to the observable, and it thus have access to the emitted log, and should thus pass that log directly to the child component, or it doesn't need/want to subscribe, and then it can pass the observable to the child so that the child is the one that subscribes. But you're subscribing in both components there, and that is confusing, and of course causes two http requests to be sent instead of one unless you use shareReplay. But that's ery confusing.

[slender basin]

So multiple subscribing is my issue and the shareReplay is a bandaid?