fix: don't instantiate providers with ngOnDestroy eagerly.

[tbosch]

Perviously, any provider that had an ngOnDestroy lifecycle hook would be created eagerly. Now, only classes that are annotated with @component, @directive, @pipe, @NgModule are eager. Providers only become eager if they are either directly or transitively injected into one of the above.

Fixes #14552

[brandonroberts]

Wouldn't this be considered a breaking change?

[tbosch]

Marked in the commit message as breaking change with small impact.

[casperchia]

This was a breaking change for us. Is there a way to make an @Injectable() instantiate eagerly? We have @Injectable() services that listens for events then performs some logic whenever such events are fired, hence they never had to be injected anywhere. Now it looks like to instantiate these services we would have to inject them through the constructor even though we never call these services directly. Which can be annoying since we now have constructors with 20+ services that are never actually referenced.

This is an example of such a service:

@Injectable()
export class SubmitEventListener {
   constructor(private eventService: EventService) {
      this.eventService.events.subscribe(event => doSomething());
   }

   doSomething() {
      console.log("hello world");
   }
}

Could we make @Injectable() take in an option to instantiate eagerly?
@Injectable({eager: true})

or perhaps something like this:

providers: [
   {provide: SubmitEventListener, useClass: SubmitEventListener, eager: true}
]

I'd be happy to submit a PR if I can get some directions on where to look.

[tbosch]

If you have an NgModule, then that module could inject them. To prevent having to list all of them, change these providers into multi providers (set "multi: true") for the same token, and then inject just this token into your NgModule constructor. You can also make each of your providers also provide an APP_ INITIALIZER, which already is a multi provider following the above pattern... Please let me know if this helps... Regarding eager: true flag: we had some bad experience with this in angularJS and would need to investigate it more thoroughly, if it actually helps, or rather makes complex apps harder to maintain...

…

On Fri, Mar 24, 2017, 6:04 PM Casper Chia ***@***.***> wrote: This was a breaking change for us. Is there a way to make an @Injectable <https://github.com/Injectable>() instantiate eagerly? We have @Injectable <https://github.com/Injectable>() services that listens for events then performs some logic whenever such events are fired, hence they never had to be injected anywhere. Now it looks like to instantiate these services we would have to inject them through the constructor even though we never call these services directly. Which can be annoying since we now have constructors with 20+ services that are never actually referenced. This is an example of such a service: ` @Injectable <https://github.com/Injectable>() export class SubmitEventListener { constructor(private eventService: EventService) { this.eventService.events.subscribe(event => doSomething()); } doSomething() { console.log("hello world"); } } ` Could we make @Injectable <https://github.com/Injectable>() take in an option to instantiate eagerly? @Injectable({eager: true}) — You are receiving this because you authored the thread. Reply to this email directly, view it on GitHub <#15070 (comment)>, or mute the thread <https://github.com/notifications/unsubscribe-auth/AAqKfw8EOEebAY-SXLSX_I8Tv5YgOynwks5rpGgvgaJpZM4MZxoQ> .

[casperchia]

Thanks for the quick response!

Using multi providers as suggested worked just fine. Not too sure about using APP_INITIALIZER though, the official docs doesn't say much about it at the moment.

For reference, here is what I did (following the example above):

const EVENT_LISTENERS: InjectionToken<any> = new InjectionToken('eventListeners');

@NgModule({
   providers: [
      {provide: EVENT_LISTENERS, useClass: SubmitEventListener, multi: true},
      {provide: EVENT_LISTENERS, useClass: OtherEventListener, multi: true},
      {provide: EVENT_LISTENERS, useClass: AnotherEventListener, multi: true},
   ]
})
export class MyModule {
   constructor(@Inject(EVENT_LISTENERS) eventListeners: any[]) {}
}

Thanks @tbosch !

[wKoza]

@casperchia , there is an example here.

[DzmitryShylovich]

@casperchia there's an issue for discussion #13960

[angular-automatic-lock-bot]

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_{This action has been performed automatically by a bot.}