DEV Community

Discussion on: Angular Component Subscription vs. AsyncPipe: Use Pipes When Possible

Collapse
 
mralanguevara profile image
Alan Guevara

Thanks for the article.

I am confused about something.

When I use async pipe

ngOnInit() {
myData$ = httpCall(....);
}

...

[data]="myData$ | async">

And lets say that later in the same component I update my data by doing another httpCall and assigning it to my observable:

updateData() {
myData$ = httpCall(....);
}

This actually works and my child component gets updated. But, if ?I subscribe to it instead:

ngOnInit() {
myData$ = httpCall(....).subscribe(data => {
this.myData = data;
});
}

...

[data]="myData">

And later I make another call:

updateData() {
myData$ = httpCall(....);
}

MyData inside the child component only updates on the first call but not on the second one...
Does a subscription completes the observable after the first time?

The weird thing is if I subscribe but using NGRX:

ngOnInit() {
myData$ = this.store.dispatch(new MyDataAction());
myData$.subscribe(data => {
this.myData = data;
});
});
}

...

[data]="myData">

And then I try to update:

updateData() {
myData$ = this.store.dispatch(new MyDataAction());
}

It updates my child component the second time!!!

Why is this happening?