angular2-material 2图标未显示

Question

我正在使用Material 2开发一个Angular 2项目.出于某种原因,图标没有显示,只是图标的"关键"是文本.

app.module:

  ...    
    import {MdButtonModule} from "@angular2-material/button";
    import {MdIconModule, MdIconRegistry} from "@angular2-material/icon";
    ...

    @NgModule({
      declarations: [AppComponent,... CollapseableComponent],
      imports: [... MdButtonModule, MdIconModule, MdInputModule],
      providers: [{
        provide: LocationStrategy,
        useClass: HashLocationStrategy
      }, ... MdIconRegistry],
      bootstrap: [AppComponent]
    })
    export class AppModule {

    }

index.html的:

...
    <link href=”https://fonts.googleapis.com/icon?family=Material+Icons" rel=”stylesheet”>
  </head>
...

我试过几种方法:

  <button md-fab> <md-icon>add</md-icon></button>
    <button md-fab> <md-icon class="md-elevation-z1">create</md-icon></button>
    <button md-icon-button>add</button>

我想我尝试了大约5个排列,但都有相同的结果.我看到了按钮,但上面有文字.仅仅图标也没有显示在任何这些方法中.

Answer 1

您现在应该使用@ angular/material,@ angular2-material已弃用.请参阅changelog

app.module:

    import {MaterialModule} from '@angular/material';


    @NgModule({
      declarations: [AppComponent,... CollapseableComponent],
      imports: [... MaterialModule.forRoot()],
      providers: [{
        provide: LocationStrategy,
        useClass: HashLocationStrategy
      }, ...],
      bootstrap: [AppComponent]
    })
    export class AppModule {

    }

还注意到您使用的”不是"CSS链接中的字体.

<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">

Plunker:http://embed.plnkr.co/lAXjoXHZ4YdNgDOMUjPB/