I have a component as follows, where I have a button calling select_property
when clicked. The thing is im not sure whether i need to unsubscribe in any way before reassigning $livevisitors
on each click , not sure whether $livevisitors | async
in the component template does this work for me.
export class LiveComponent{
livevisitors$: Observable<LiveVisitor[]>;
selected_property_id: number = 0;
constructor(
private store: Store<AppState>
) {
this.livevisitors$ = this.store.select(selectAllLiveVisitors);
}
select_property(id){
this.selected_property_id = id;
if (id == 0){
this.livevisitors$ = this.store.select(selectAllLiveVisitors);
} else {
this.livevisitors$ = this.store.select(selectLiveVisitorsByPropertyId, {property_id: id});
}
}
The async pipe subscribe and unsubscribe for you. You don't need to manage manual unsubscription.
From the official documentation :
When the component gets destroyed, the async pipe unsubscribes automatically to avoid potential memory leaks.