在 Ionic 2 中，如何创建使用 Ionic 组件的自定义指令？

创建基本指令很简单：

import {Component} from 'angular2/core';

@Component({
    selector: 'my-component',
    template: '<div>Hello!</div>'
})
export class MyComponent {
    constructor() {

    }
}

这按预期工作。但是，如果我想在指令中使用 Ionic 组件，事情就会崩溃。

import {Component} from 'angular2/core';

@Component({
    selector: 'my-component',
    template: '<ion-list><ion-item>I am an item</ion-item></ion-list>'
})
export class MyComponent {
    constructor() {

    }
}

该指令已渲染，但 Ionic 组件未转换，因此无法正常显示/工作。

我找不到任何这方面的例子。我该怎么做？

找到了答案here https://forum.ionicframework.com/t/how-to-use-ionic-components-inside-custom-components-directives/39066:

您必须导入 Ionic 组件并将它们注册为 “指令”

所以我的第二个例子变成：

import {Component} from 'angular2/core';
import {List, Item} from 'ionic/ionic';

@Component({
    selector: 'my-component',
    directives: [List, Item],
    template: '<ion-list><ion-item>I am an item</ion-item></ion-list>'
})
export class MyComponent {
    constructor() {

    }
}