web-dev-qa-db-ja.com

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コンポーネントは変換されないため、正しく表示/動作しません。

これに関する例は見つかりません。どうすればよいですか？

javascriptionic2
12
Schlaus

答えが見つかりました ここ ：

Ionicコンポーネントをインポートし、それらを「ディレクティブ」として登録する必要があります

したがって、私の2番目の例は次のようになります。

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() {

    }
}
12
Schlaus