This chapter will help you in getting started with angular material. You will learn how to install angular material in your angular application and test it by displaying a material component in your app.
Installing Angular Material
Step 1- Launch the Angular CLI and run the command: ng add @angular/material to install the angular material, angular animations, and the component development kit (CDK).
Step 2-As the installation progresses, you will be prompted to customize your features, which will include the following:
Choose your preferred custom theme.
Configure the global angular material typography styles.
Finally, configure your browsing animations and enable them.
Display Component
You will need to display a component in your application to ensure that everything is working properly. Let's add a slider component to our application:
First, add the MatSliderModule to your app.module.ts file
import { MatSliderModule } from "@angular/material/slider";
@NgModule ({
imports: [
MatSliderModule,
]})
class AppModule {}
|
Include the mat-slider > ta in your application now.
Finally, run the command ng serve to start the local dev server
Conclusion
In conclusion, to install angular material in your application, you only need to run the command ng add @angular Material. That's it. In the next chapter, we are going to learn more about Angular 12 Routing and Navigation