angular2-material 2圖標未顯示

我正在使用Material 2的Angular 2項目。出於某種原因，圖標未顯示，只是圖標的「關鍵」作爲文本顯示。angular2-material 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個排列，但都相同的結果。我看到按鈕，但上面有文字。只有圖標也沒有顯示在任何這些方法中。

來源

2016-12-10 Werner Wiking

您現在應該使用@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/

來源

2016-12-10 22:39:26

嘿，非常感謝您指出了棄用！我也剛剛發現錯誤的字符複製粘貼問題。這是他的問題的根源。一個令人尷尬的。乾杯! –

@WernerWiking 我很高興幫你，我總是檢查每一個新版本在GitHub上更改日誌，看看有什麼新的能真正幫助文檔缺少，因爲阿爾帕階段的時候。如果您認爲這是正確答案，請將其標記爲已接受，請點擊答案旁邊的複選標記將其從空心切換爲綠色。 –

MaterialModule現已棄用 – epiphanatic

由於JJB指出，在這一個特別的問題是一種錯誤的報價，其中包括在index.html中的谷歌的CSS（這是一個複製粘貼錯誤時）。

J J B說過的另一件事是帶走更重要的東西 - @ angular2-material已被棄用。

來源

2016-12-11 11:35:04

angular2-material 2圖標未顯示

回答

相關問題