关注文档:
https://material.angular.io/components/icon/overview#icon-sets
本指南:
https://materialdesignicons.com/getting-started
我写了这个:
app.module.ts
import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { AppRoutingModule } from './app-routing.module';
import { AppComponent } from './app.component';
import { FeaturesModule } from './features/features.module';
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
import { MatIconRegistry, MatIconModule } from '@angular/material';
import { DomSanitizer } from '@angular/platform-browser';
import { HttpClientModule } from '@angular/common/http';
@NgModule({
declarations: [AppComponent],
imports: [
BrowserModule,
BrowserAnimationsModule,
HttpClientModule,
MatIconModule,
AppRoutingModule,
FeaturesModule
],
providers: [],
bootstrap: [AppComponent]
})
export class AppModule {
constructor(matIconRegistry: MatIconRegistry, domSanitizer: DomSanitizer) {
matIconRegistry.addSvgIconSet(
domSanitizer.bypassSecurityTrustResourceUrl('./assets/icons/mdi.svg')
);
}
}
然后在模板app.component.html
中:
<mat-icon svgIcon="android"></mat-icon>
<router-outlet></router-outlet>
我还在assets
中设置了angular-cli.json
。
但是当我加载页面时,我得到了:
Error retrieving icon: Unable to find icon with the name "android"
事实是,正在加载.svg
文件:
也许我错过了什么。
如何在角度材质2中正确添加Iconset?