试试使用 Angular Material
环境
-
- Angular: v9.0.4
-
- Node: v12.16.1
- OS: win32 x64
添加AngularMaterial
在项目下执行命令
ng add @angular/material
虽然会有各种各样的问题,但按下Enter键即可设置默认值。
在src/index.html中,已加载来自Google APIs的Material Icons的样式表。
<link href="https://fonts.googleapis.com/css?family=Roboto:300,400,500&display=swap" rel="stylesheet">
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
angularMaterial已经被添加进来。
仅仅添加它还不够,需要在app.module.ts中进行配置以便使用。
app.module.ts 的中文翻译:应用模块.ts
我想尝试使用AngularMaterial的MatIcon。
import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { AppComponent } from './app.component';
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
+ import { MatIconModule } from '@angular/material/icon';
@NgModule({
declarations: [
AppComponent
],
imports: [
BrowserModule,
BrowserAnimationsModule,
+ MatIconModule
],
bootstrap: [AppComponent]
})
export class AppModule { }
表示 shì)
<mat-icon>help</mat-icon>
请参考
-
- AngularMaterial:https://material.angular.io/
Material Design:https://material.io/resources/icons/?style=baseline