如何將離析菜單圖標更改爲離子圖像圖標

Question

我正嘗試將菜單圖標替換爲離子應用程序中的圖像圖標。 我有一個menu.html如下：

<ion-side-menus> 
<ion-side-menu-content> 
<ion-nav-bar class="bar-dark nav-title-slide-ios7"> 
</ion-nav-bar> 
<ion-nav-view name="menuContent" animation="slide-left-right"></ion-nav-view> 
</ion-side-menu-content> 

<ion-side-menu side="left"> 
<header class="bar bar-header bar-dark"> 
</header> 
    <ion-content class="has-header"> 
    <ion-list> 
    <ion-item menu-close ui-sref="app.home"> 
     Home 
    </ion-item> 
    <ion-item menu-close ui-sref="app.profile"> 
     Update Profile 
    </ion-item> 
    <ion-item menu-close ui-sref="app.project"> 
    Add Project 
    </ion-item> 

    <ion-item menu-close ng-click="logout();"> 
     Log Out 
    </ion-item> 
    </ion-list> 
</ion-content> 
</ion-side-menu> 
</ion-side-menus> 

但我不知道如何更換圖像圖標的菜單圖標。可以請你幫

這是home.html的：

<ion-nav-buttons side="left"> 
<button menu-toggle="left" class="button button-icon icon ion-navicon"></button> 
</ion-nav-buttons> 
<icon-view> 
<ion-pane> 
<ion-content> 
</ion-content> 
</ion-pane> 
</icon-view> 

Answer 1

更換button和navicon類的image標籤

<ion-nav-buttons side="left"> 
<img src="img/myImage.jpg" class="button button-icon button-clear" menu-toggle="left"> 
</ion-nav-buttons> 
<icon-view> 
<ion-pane> 
<ion-content> 
</ion-content> 
</ion-pane> 
</icon-view> 

Example fiddle

Answer 2

可以覆蓋菜單圖標的CSS全球在app.scss通過添加在css下方和資產文件夾上的菜單圖標。

ion-icon[name='menu']:before { 
    content: url('../assets/icon/menu.png'); 
}