如何添加svg自定义图标离子2

时间:2016-09-08 14:54:26

标签: ionic-framework ionic2 ionic-view

如何添加自定义图标ionic 2,我有svg文件我需要在菜单中添加图标

this.pages = [
      {icon: 'Test', title: 'Logout', component: LoginPage }
    ];

    <ion-list>
      <button menuClose ion-item *ngFor="let p of pages" (click)="openPage(p)">
        <ion-icon name="{{p.icon}}" svgversion item-left></ion-icon>
        {{p.title}}
      </button>
    </ion-list>

layout.scss

ion-ion[name="test"][svgversion] {
  content: url("../../img/accountsDeposits.svg");
}

2 个答案:

答案 0 :(得分:0)

您只需添加/src/theme/global.scss/page/your-page/your-page.scss

.logo {

    background: url(../assets/images/logo-vc.svg) no-repeat top left;
    background-size: contain;
    width: 80px;
    height: 35px;
    margin: 20px auto 0 auto;

}

答案 1 :(得分:0)

您可以使用fontastic从svg图标创建svg图标字体,您可以在线使用它或导出到您自己的svg字体,它会为您提供如何使用它的说明,它是免费的

Follow link