angular 2 组件内的图标不再工作

Question

已更新为 "ionic-framework"：“2.0.0-alpha.53”，来自更早的版本。并添加了这个依赖项："ionicons": "3.0.0-alpha.3".

我在 html 中将其用于 Angular 2 组件。 html 除了我尝试使用离子图标外，此 html 中没有任何离子内容。

<div class="saveButton icon ion-md-add"
    (click)="onSaveSelected()"></div>

这在 alpha 42 中有效。我如何在 angular 2 组件中使用离子图标？我尝试了以下方法：

<div class="saveButton icon ion-md-add"
    (click)="onSaveSelected()">

    <ion-icon name="heart"></ion-icon>
</div>

这只是显示空白 div。

每当我在 <ion-menu> 中使用这条线 <ion-icon name="heart"></ion-icon> 时，它工作正常。

谢谢

Answer 1

From Ionic Forum

If it is a custom component you need to include IONIC_DIRECTIVES in the component:

import {Component} from 'angular2/core';
import {IONIC_DIRECTIVES} from 'ionic/ionic';

@Component({
  selector: 'my-component'
  template: `<div class="my-style">
              <ion-icon name="heart"></ion-icon>
            </div>`,
  directives: [IONIC_DIRECTIVES]
})
export class MyCustomComponent {}

Ionic Page Directives.

angular 2 组件内的图标不再工作

Icon inside angular 2 component no longer working

ionic-framework

ionic2

angular