Używanie wejścia jonowego wewnątrz komponentu niestandardowego - kątowe, jonowe2

Próbuję utworzyć niestandardowy komponent w angular2 / ionic2, który zawiera dane wejściowe, oto kod:

import {Component} from "angular2/core";
import {ItemInput} from "ionic-framework/ionic";


@Component({
directives: [ItemInput],
selector: "add-input",
template: `
<ion-input clearInput>
<input type="text" value="">
</ion-input>
`
})
export class AddInput {
constructor() { }
}

Problem polega na tym, że wejście jonów wydaje się byćignorowane w końcowej stronie / widoku (bez zastosowanych stylów, nie można go nawet kliknąć). Jeśli przesuję kod tak, jak do głównego widoku, to działa. Dodając do tego niestandardowego komponentu przycisk, taki jak

<button>ok</button>

i importowanie przycisku (i dodawanie go dolista dyrektyw tego komponentu też) to działa. Więc nie jestem pewien, czy trzeba zrobić coś specjalnego w stosunku do komponentu ItemInput, który ma być użyty w niestandardowym komponencie, lub jeśli po prostu klikam błąd.

Używanie jonowego 2.0 alpha49.

Jakieś wskazówki?

Odpowiedzi:

Importuj dyrektywy jonowe za pomocą IONIC_DIRECTIVES:

import {Component} from "@angular/core";
import {IONIC_DIRECTIVES} from "ionic-angular";

@Component({
selector: "add-input",
template: `
<ion-input clearInput>
<input type="text" value="">
</ion-input>
`,
directives: [IONIC_DIRECTIVES]
})

export class AddInput {
constructor() {}
}

Mam nadzieję, że jej odpowiedź, inaczej spojrzeć na Tworzenie niestandardowych komponentów w Ionic2

Dla osób, które otrzymały ten błąd:

../node_modules/ionic-angular/index"" has no exported member "IONIC_DIRECTIVES"

W Ionic 3, zmieniła się deklaracja dyrektywy. Komponent nie zawiera dyrektywy, moduł wiąże dyrektywy jonowe do komponentu, zamiast tego użyj tego w swoim module IonicPageModule.forChild(MyComponent):

import { IonicModule; IonicPageModule } from "ionic-angular";
import { MyApp } from "./app.component";
import { MyComponent } from "../directives/my-directive/my-directive";

@NgModule({
imports: [
IonicModule.forRoot(MyApp),
IonicPageModule.forChild(MyComponent) // Here
],
declarations: [MyApp, MyComponent]
})

Znalazłem tutaj odpowiedź: https://github.com/ionic-team/ionic/blob/master/src/module.ts

Mam nadzieję, że to pomoże, okrzyki!