ObjectUnsubscribedError: object unsubscribed error when I am using ngx-progress in angular 2
Updated - Angular 8
This answer is still valid syntactically for Angular 8.
I realize this is an old post, we're on Angular 6 now, I believe. However, I got this error and wanted to post a solution.
I had this problem when I called .unsubscribe()
directly on the object that I had called .subscribe()
on. However, when you subscribe to an event, that method hands back a Subscription
typed value. You need to save this (possibly on your component's class), then call unsubscribe on that Subscription object when you're done.
Examples
Bad Code:
this.someEvent.subscribe(() => {
// DO SOMETHING
})
...
this.someEvent.unsubscribe()
Good Code:
this.myEventSubscription = this.someEvent.subscribe(() => {
// DO SOMETHING
})
...
this.myEventSubscription.unsubscribe()
Again, you need to unsubscribe from the Subscription
object that the .subscribe()
method returns when you call it.
Good luck!
I really liked the way @kbpontius told, so I am also doing the same approach
Whenever you subscribe, subscribe in the new variable. So after unsubscribe it can be subscribed Examples
Bad Code:
this.someEvent.subscribe(() => {
// DO SOMETHING
})
...
ngOnDestroy() {
this.someEvent.unsubscribe()
}
Good Code:
Declare the event name
myEventSubscription: any;
//Now it can be use like this
this.myEventSubscription = this.someEvent.subscribe(() => {
// DO SOMETHING
})
...
//Now unsubcribe this in last phase of destroying component. You can destroy in other function too if you want to destroy the service in the same component
ngOnDestroy() {
this.myEventSubscription.unsubscribe()
}
Again, you need to unsubscribe from the Subscription object that the .subscribe() method returns when you call it.
This is happening because the component that holds the progressbar is being destroyed while the progressbar is running, so you should put <ng-progress></ng-progress>
in a root component (or a component that does not get destroyed)
If you are using the progress for http requests there is a new feature called automagic progressbar, you might want to try it out!
Update
Since v2.1.1, you can use the component anywhere without getting that error