离子2后退按钮或任何图标未显示。只显示小方框图标 [英] ionic 2 back button or any icon is not showing. only small box icon is showing

问题描述

我在很多屏幕上都遇到了这个图标问题。例如。我有一个屏幕，我在导航栏的左侧添加了一些图标。但它根本没有显示图标。只显示小背盒。我的代码是：

I am facing this icon problem in many screen. for example. i have one screen , where i have added some icon at left side of nav bar. but its not at all showing the icon. only small back box alone is showing .here is my code:

 <ion-buttons>
    <button ion-button >
        <ion-icon name="close"></ion-icon>
      </button>
       </ion-buttons

我也使用它：

 <ion-buttons>
        <button ion-button >
<ion-icon ios="ios-close" md="md-close"></ion-icon>
 </button>
           </ion-buttons

但没有显示use.still黑色小方框图标。

but no use.still black small box icon is showing.

好吧现在，我尝试使用push nav。但是它没有显示后退按钮。我的代码是：

okay now, i tried with push nav.but there alos its not showing the back button.here is my code :

my home.html：

  <button class="button button-outline footerbtnone" (click)="login()">LOG IN</button>

my home.js

 constructor(public navCtrl: NavController) {
  }
login() {
    this.navCtrl.push(LoginPage);

  }

但是当我搬到 LoginPage 我看不到后退按钮图标。我仍然看到那个小黑盒子图标。那个图像：

But when i move to LoginPage i can't see the back button icon. still i am seeing that small black box icon.here that image :

请帮帮我。我错过了什么。

please help me out.what i am missing.

谢谢

推荐答案

方块可能表示字体未正确加载或浏览器尝试使用备用字体。验证ionons字体是否正在加载的简单方法是在Chrome开发工具中检查您的来源。我看起来像这样： http：// localhost：8100 / assets / fonts / ionicons.woff2？v = 3.0.0-alpha.3

The squares probably signal that the font is either not getting loaded properly or the browser is trying to use an alternate font face. An easy way to verify that the ionicons font is being loaded at all is to check your sources in Chrome Dev Tools. Mine looks like this: http://localhost:8100/assets/fonts/ionicons.woff2?v=3.0.0-alpha.3

如果你没有看到那个文件（或类似的东西）被加载，那么就没有要渲染的字体。

If you don't see that file (or something similar) getting loaded then there's no font to render.

ionicon字体应该得到如果它在package.json文件中引用并且存在于node_modules文件夹中，则自动加载。验证后，如果没有加载字体，请确保没有任何其他CSS导入/变量覆盖ionicons字体导入。例如：

The ionicon font should get loaded automagically if it's referenced in your package.json file and exists in the node_modules folder. After verifying this, if the font is not getting loaded, make sure you don't have any other CSS imports/variables that are overriding the ionicons font import. e.g something like this:

 * {font-family: 'Lato' !important;}

上面的结果会导致从不加载ionicons字体，因为Lato被指定用于所有字形，覆盖了早期的@ionicon导入。

The above will result in the ionicons font never being loaded because Lato is specified to be used for all glyphs, overriding the earlier @ionicons import.

这篇关于离子2后退按钮或任何图标未显示。只显示小方框图标的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！