离子2后退按钮或任何图标未显示。只显示小方框图标

Question

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

 <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黑色小方框图标显示。

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

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时，我看不到后退按钮图标。我仍然看到那个小黑盒子图标。那个图像：

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

由于

Answer 1

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

如果您没有看到该文件（或类似的东西）被加载，那么就没有可呈现的字体。

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

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

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