2017-03-12 15 views
4

Wie Schriftart Awesome Symbole mit <ion-tab></ion-tab> zu verwenden?Font Awesome mit Ionic2

Was ich versuche:

<ion-tabs> 
    <ion-tab [root]="tab1Root" class="fa fa-calculator" tabTitle="Home" ></ion-tab> 
    <ion-tab [root]="tab2Root" tabTitle="About" tabIcon="fa-calculator"></ion-tab> 
    <ion-tab [root]="tab3Root" tabTitle="Contact" tabIcon="contacts"></ion-tab> 
</ion-tabs> 

Antwort

0

Hier ist meine Lösung Font Ehrfürchtig<ion-tab></ion-tab>

Hinweis hinzuzufügen: Stellen Sie sicher, dass Sie richtig Schriftart in ionischem Projekt genial installiert haben.

your-example.html

<ion-tabs tabsPlacement="top" > 
    <ion-tab [root]="tabAlgorithms" tabTitle="Algorithms" tabIcon="fa-sitemap" ></ion-tab> 
</ion-tabs> 

your-example.scss

.fa-icons-general { 
    display: inline-block; 
    font: normal normal normal 14px/1 FontAwesome; 
    font-size: inherit; 
    text-rendering: auto; 
    -webkit-font-smoothing: antialiased; 
    -moz-osx-font-smoothing: grayscale; 
    transform: translate(0, 0); 
} 

.ion-ios-fa-sitemap::before, 
    .ion-ios-fa-sitemap-outline::before, 
    .ion-md-fa-sitemap::before { 
     @extend .fa-icons-general; 
     content: "\f0e8"; 
    } 

Hoffnung dies Ihr Problem lösen wird.