What is Bootstrapping in Angular & how to use it?
The Bootstrap is the root AppComponent that Angular creates and inserts into the host web page i.e. “index.html”
You can also put more than one component tree on the web page of host, that’s not typical. Most of the applications have only one component tree and they bootstrap a single root component and you can call the one root component you want but most developers call the AppComponent. In bootstrapping process, components list is created in the bootstrap array and inserts each into the browser (DOM).
The Angular default Module i.e. NgModules helps us to organize an application into connected blocks
of functionality. The NgModule properties for the minimum “AppModule” generated by the CLI which follows as:
How To Use Component Lifecycle Hooks In Angular
Declarations — It is use to declare the application components.
Imports — Every application must import BrowserModule to run the app in the browser.
Providers — There are none to start.
Bootstrap — This is the root AppComponent that Angular creates and inserts into the index.html host web page.
Subject and Behavior Subject in Angular 13 | Subject | Angular 13 Tutorial in Hindi
By default, Bootstrap file is created in the folder “src/main.ts” and “main.ts” file is very stable. Once you have set it, you never change it again and its looks like
What is bootstrapping in Angular? Is it possible to start Angular in any other way rather than app.module? If yes, then how?
Bootstrapping means starting an Angular application. Yes, it is possible to start angular in any other rather than app.module. We can start Angular using our defined component instead of “app.module”. For this, we must follow the following steps.
Make a module file, say “my.module.ts”, in app folder.
Make a component using command “ng g c my” in app folder. Instead of c you can also write component in command.
Go to “my.module” file and register your component in this file and use “MyComponent” in declaration and bootstrap.
Go to the “main.ts” file, put your module name “MyModule” into “bootStrapModule” method.
Go to “index.html” file and put the my component tag inside body tag.
