Material Design Lite Icons fehlen, wenn in Angular

Question

mit

So begann ich in meinem MDL Angular-Projekt zu verwenden, die meist gut funktioniert, aber die MDL-Icons arbeiten gerade nicht dort ...

Ich bin mit ihnen wie diese <i class="material-icons">share</i> und der Browser schreibt einfach "share" als normale Schriftart und nicht als Icon wie es sollte es tun. Ich habe die MDL CSS und JS enthalten und auch das Angular-Material-Design-Lite-Paket enthalten.

Answer 1

Scheint, wie ich nur die Schrift über Bower hatte zu installieren: bower install material-design-icons --save und fügen diese zu meinen CSS:

.material-icons { 
    font-family: 'Material Icons'; 
    font-weight: normal; 
    font-style: normal; 
    font-size: 24px; 
    line-height: 1; 
    letter-spacing: normal; 
    text-transform: none; 
    display: inline-block; 
    white-space: nowrap; 
    word-wrap: normal; 
    direction: ltr; 
    -webkit-font-feature-settings: 'liga'; 
    -webkit-font-smoothing: antialiased; 
} 

Answer 2

Sie müssen sicherstellen, dass alle Schriftarten Assets (.woff, .svg, .tff etc) korrekt installiert sind, auch die Schriftart-Gesicht in Ihrem CSS-Blatt ist im richtigen Pfad verwiesen.