Discussion:
[AngularJS] Subscribing to Observables in the constructor.
Filipe Madureira
2018-12-10 09:41:33 UTC
Permalink
Hello,

i have a simple question cause by my poor understanding of the framework.

I'm aware of Angular lifecycle hooks
<https://angular.io/guide/lifecycle-hooks> but i'm still confused on where
i should subscribe to Observables that aren't related to any angular
lifecycle.

I'm using Redux bindings for Angular
<https://github.com/angular-redux/platform> and i'm constantly reading from
Observables to be aware of the values in the global state, but where should
i subscribe to the Observables?

constructor(private readonly ngRedux: NgRedux<IAppState>, private
notificationsService: NotificationsService) {

// Subscribe to global HTTP errors and show a notification in case of
problems.
this.getErrorSlice$.subscribe(errorData => {
// Check that errors were actually returned and weren't already shown
to the user
if (errorData.error.length > 0 && errorData.shown === false) {
// Show the notification and mark it as "shown" (to avoid showing
infinite notifications)
this.notificationsService.error('Problems fetching the list of
events from the server.');
// turns errorData.shown to true.
this.ngRedux.dispatch(shownError());
}
});

I'm currently subscribing to this observable in the constructor and based
on the data returned i fire a notification. I'm confused on how this is
possible, isn't the constructor supposed to fire just once, at the
component creation?

How come the code inside the .subscribe() function keeps getting run even
though the constructor has already been fired?

Thanks,
Filipe
--
You received this message because you are subscribed to the Google Groups "Angular and AngularJS discussion" group.
To unsubscribe from this group and stop receiving emails from it, send an email to angular+***@googlegroups.com.
To post to this group, send email to ***@googlegroups.com.
Visit this group at https://groups.google.com/group/angular.
For more options, visit https://groups.google.com/d/optout.
Sander Elias
2018-12-10 16:21:03 UTC
Permalink
Hi Filipe,

You are subscribing to an observable. An observable is not a promise, but
more like a stream. It keeps on running until the upstream observable is
complete, or until you unsubscribe. I can't explain Observable is a single
message, but there are loads of courses available online.

Regards
Sander
--
You received this message because you are subscribed to the Google Groups "Angular and AngularJS discussion" group.
To unsubscribe from this group and stop receiving emails from it, send an email to angular+***@googlegroups.com.
To post to this group, send email to ***@googlegroups.com.
Visit this group at https://groups.google.com/group/angular.
For more options, visit https://groups.google.com/d/optout.
Filipe Madureira
2018-12-11 09:46:23 UTC
Permalink
Hello Sander,

Thank you. I started reading about Observables.

Anyways, where should i subscribe to them? On ngOnInit or the constructor?
Where should i unsubscribe? On ngOnDestroy? All around what are the best
practices when dealing with Observables in Angular 6+?

I already use the pipe in the template (see the following piece of code as
example) but now i'm trying to clear the logic from my template and because
of this i should handle Observables directly in the .ts file, i'd love to
do it the correct way.

<button [disabled]="( isParticipantPosting$ | async)">


If you have good articles to read feel free to share, thank you very much :)

Regards,
Filipe
Post by Sander Elias
Hi Filipe,
You are subscribing to an observable. An observable is not a promise, but
more like a stream. It keeps on running until the upstream observable is
complete, or until you unsubscribe. I can't explain Observable is a single
message, but there are loads of courses available online.
Regards
Sander
--
You received this message because you are subscribed to the Google Groups "Angular and AngularJS discussion" group.
To unsubscribe from this group and stop receiving emails from it, send an email to angular+***@googlegroups.com.
To post to this group, send email to ***@googlegroups.com.
Visit this group at https://groups.google.com/group/angular.
For more options, visit https://groups.google.com/d/optout.
Loading...