代码之家  ›  专栏  ›  技术社区  ›  Sandra Willford

检索图标时出错:找不到名称为“:done”的图标

  •  1
  • Sandra Willford  · 技术社区  · 6 年前

    这是我第一次使用角度材料,我有一个垫子图标的问题。

    我的index.html索引有: <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">

    在我的共享模块中,导入了图标:

    import { NgModule } from '@angular/core';
    import { CommonModule } from '@angular/common';
    import {
        MatButtonModule,
        MatCardModule,
        MatIconModule,
        MatMenuModule,
        MatToolbarModule,
    } from '@angular/material';
    
    @NgModule({
        imports: [
            CommonModule,
            MatButtonModule,
            MatCardModule,
            MatIconModule,
            MatMenuModule,
            MatToolbarModule
        ],
        exports: [
            MatButtonModule,
            MatCardModule,
            MatIconModule,
            MatMenuModule,
            MatToolbarModule
        ],
        declarations: []
    })
    export class SharedModule { }
    

    然后我将SharedModule导入我的LoginModule:

    import { NgModule } from '@angular/core';
    import { CommonModule } from '@angular/common';
    import { SharedModule } from '../../shared/shared.module';
    import { LoginRoutingModule } from './login.routing.module';
    import { LoginContainerComponent } from './login-container/login-container.component';
    import { LoginViewComponent } from './login-view/login-view.component';
    
    @NgModule({
        imports: [
            CommonModule,
            LoginRoutingModule,
            SharedModule
        ],
        declarations: [
            LoginContainerComponent,
            LoginViewComponent
        ]
    })
    
    export class LoginModule { }
    

    最后,我使用视图中的mat图标:

    <mat-card>
        <mat-card-title-group>
            <mat-card-title>
                Welcome to Track-It
            </mat-card-title>
            <mat-card-subtitle>
                In order to use all of Track-it's goodness, please login...
            </mat-card-subtitle>
        </mat-card-title-group>
        <mat-card-content>
            Lorem, ipsum dolor sit amet consectetur adipisicing elit. Maxime quod labore autem. Sunt expedita ullam quis in deserunt rem eum, quas culpa quo aut eius consequuntur magni. Voluptates, mollitia ullam.
        </mat-card-content>
        <mat-card-actions [align]="'end'">
            <button mat-flat-button>
                Login&nbsp;
                <mat-icon svgIcon="done"></mat-icon>
            </button>
        </mat-card-actions>
    </mat-card>
    

    悬停这个我得到以下错误: Error retrieving icon: Unable to find icon with the name ":done"

    我对角不是新的,但绝对是新的角度材料,所以不知道这里发生了什么。我上面说的应该有用。思想?

    1 回复  |  直到 6 年前
        1
  •  9
  •   Ploppy    6 年前

    这就是你应该如何使用 mat-icon 成分

    <mat-icon>done</mat-icon>