如何在后退按钮中获取自定义图标？ [英] How to get a custom icon in a back button?

问题描述

我有以下代码：

<ion-nav-buttons side="left">
    <button class="button button-icon icon ion-chevron-left" ng-click="goBack()"></button>
</ion-nav-buttons>

会产生以下输出：

< img src = https://i.stack.imgur.com/yrDvR.png alt =在此处输入图片描述>

我想更改二手自定义图标的图标（48×48 px）。

I would like to change used icons for the custom icon (48×48 px).

如何在Ionic中正确执行操作？

How can I do it in right way in Ionic?

我试图按照这个主题，但是没有运气。

I tried to follow the instructions in this topic, but without luck.

推荐答案

存在解决问题的简便方法，只需在您的.js文件中输入以下内容即可：

Exist easy way to solve your problem, just put in your .js this:

 $ionicConfigProvider.backButton.icon('my-back-button');

（请参阅$ ionicConfigProvider文档此处）

和您的CSS：

.my-back-button {
content: url('http://cdn.mysitemyway.com/etc-mysitemyway/icons/legacy-previews/icons/black-ink-grunge-stamps-textures-icons-arrows/003683-black-ink-grunge-stamp-textures-icon-arrows-double-arrowhead-left.png');
width: 35px;
}

您可以在LINK

另一个解决方案可以是（仅使用CSS）：

Another solution can be this (using only CSS):

  <ion-nav-back-button class="button-clear">
    <i class="button button-icon my-back-button"></i>
  </ion-nav-back-button>

和您的CSS：

.my-back-button {
content: url('http://cdn.mysitemyway.com/etc-mysitemyway/icons/legacy-previews/icons/black-ink-grunge-stamps-textures-icons-arrows/003683-black-ink-grunge-stamp-textures-icon-arrows-double-arrowhead-left.png');
width: 48px;
}

请参见以下示例。

See this example here.

注意：一个离子博客在某种程度上建议使用图标字体，但从我的角度来看，它并没有几乎没有图标的感觉。请阅读此链接。

Note: A ionic blog in some way suggests using icon-fonts, but from my point does not make sense when there are few icons. Please read this link.

我希望此信息是对您有用。

I hope this information is useful to you.

这篇关于如何在后退按钮中获取自定义图标？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！