0

我正在制作一个 Ionic/cordova 应用程序,我正在尝试使用 Ionic 图标。我注意到在使用“ios”命名时,它可以完美运行,但在使用通用名称或 md 名称时却不行。在这些情况下,看不到任何图标。我想让它自动选择每个平台的最佳图标(根据文档应该做什么)

选项卡示例

我有第一个选项卡的代码:

<ion-tab title="tab1" icon-off="ion-ios-list-outline" icon-on="ion-ios-list" href="#/tab/list">
(converts to <i class="icon ion-ios-list" ng-if="getIcon()" style=""></i>)

=> 图标可见

但是当使用通用或材料设计名称时:

<ion-tab title="tab1" icon-off="ion-list" icon-on="ion-list" href="#/tab/list">
(converts to <i class="icon ion-list" ng-if="getIcon()"></i>    
or for md <i class="icon ion-md-list" ng-if="getIcon()" style=""></i>)

=> 图标不见了

按钮示例

<button class="button button-icon ion-person-outline"></button>=> 没有图标
<button class="button button-icon ion-ios-person-outline"></button>=> 有效
其他图标(如条形码和列表)的行为相同。

有一个没有 ios 的例外情况,那就是“加号”图标:
<button class="button button-icon ion-plus"></button>=> 有效!'
很奇怪,根据我应该使用的文档ion-add,但这也没有给出任何图标。

使用离子图标

使用 ion-icons 根本没有图标(当我检查 DOM 时,它还显示宽度和高度为 0)
<ion-icon name="add"></ion-icon>=> 没有图标
<ion-icon name="plus"></ion-icon>=> 没有图标


作为参考,我正在使用 Visual Studio、Cordova CLI 6.2.0 并且文件 /css/ionic.app.css 显示“Ionicons,v2.0.1”

我究竟做错了什么?

4

1 回答 1

0

好吧,我的错。我使用的是 Ionic 1 框架,而图标上的在线文档适用于版本 2。我现在正在迁移到 v2。

于 2016-10-21T09:38:32.797 回答