Hooking into the Angular bootstrap process

Today while exploring Angular bootstrap process I’ve come across an interesting : piece of code private _loadComponent(componentRef: ComponentRef ): void { this.attachView(componentRef.hostView); this.tick(); this._rootComponents.push(componentRef); // Get the listeners lazily to prevent DI cycles. const listeners = this._injector.get(APP_BOOTSTRAP_LISTENER, []).concat(this._bootstrapListeners); listeners.forEach((listener) => listener(componentRef)); } This is the function that Angular calls when instantiating the application. Besides giving insights into how a component is added into the application, it also suggests that for each bootstrapped component Angular calls listeners registered under APP_BOOTSTRAP_LISTENER token and passes bootstrapped component to them. It means that we can use such hooks to subscribe to the application bootstrap process and perform our initialization logic. For example, here is how Router to the process and . hooks into executes some initialization Since Angular passes initialized component into the callback, we can get a hold of root of the application like this: ComponentRef import {APP_BOOTSTRAP_LISTENER, ...} from '@angular/core'; @NgModule({ imports: [BrowserModule, ReactiveFormsModule, TasksModule], declarations: [AppComponent, BComponent, AComponent, SComponent, LiteralsComponent], providers: [{ provide: APP_BOOTSTRAP_LISTENER, multi: true, useFactory: () => { return (component: ComponentRef ) => { console.log(component.instance.title); } } }], bootstrap: [AppComponent] }) export class AppModule { } After running into such functionality in the sources I checked the documentation and it’s and the following description is provided: described as experimental All callbacks provided via this token will be called for every component that is bootstrapped. Signature of the callback: (componentRef: ComponentRef) => void Since there are no examples I thought I’d describe the functionality and show how it can be used. P.S. This article is short but I hope it gave you some useful insights. If so, I’d appreciate if you it. I’m working on the few in-depth articles regarding bootstrap process, view composition and injectors hierarchy. If you’d like to get notified when they are finished — do . Thanks! recommended follow me