Home >Web Front-end >JS Tutorial >A brief discussion on how to introduce third-party UI library (Angular Material) into Angular projects
This article will introduce to you how to introduce a third-party UI library (Angular Material) into the Angular project. It has certain reference value. Friends in need can refer to it. I hope it will be helpful to everyone.
Environment:
- Angular CLI: 11.0.6
- Angular: 11.0.7
- Node: 12.18.3
- npm : 6.14.6
- IDE: VSCode
Angular development, unless you only have one or two simple pages, introducing a third-party UI library is essential. As for which library to use, you need to consider many aspects. [Related tutorial recommendations: "angular tutorial"]
For example:
Popularity
Version update status (whether anuglar updates can be followed up, whether bugs are fixed in time)
UI style, whether it is suitable for the project
Ease of getting started
Completeness of the documentation
There are many class libraries available for Angular on the market, which can be selected according to the project and enterprise conditions. Briefly list the optional UI libraries.
Angular Material
: angular official UI library. https://material.angular.io/
clarity
: A relatively popular foreign framework, https://clarity.design/.
NG-ZORRO
: Angular version of Alibaba Ant Design. https://ng.ant.design/docs/introduce/en
Element Angular
: The very popular Vue-based Element in China also has an Angular version. https://element-angular.faas.ele.me/
Kendo UI
. Many are very powerful, but they require a fee. https://www.telerik.com/kendo-angular-ui
##2.1 . Advantages and disadvantages
2.1.1. Advantages
2.1.2. Disadvantages
2.2. Introduction to the project
1. Execute the following command in the root directory:ng add @angular/material2. Import to the module to which the page belongs, or to app.module.ts.
// import MatSliderModule import { MatSliderModule } from '@angular/material/slider'; … @NgModule ({.... imports: [..., MatSliderModule, …] })
Programming Video! !
The above is the detailed content of A brief discussion on how to introduce third-party UI library (Angular Material) into Angular projects. For more information, please follow other related articles on the PHP Chinese website!