使用自定义组件内部的离子输入 [英] Using ion-input inside custom component

问题描述

我试图创造angular2 / ionic2其中包含一个输入自定义组件，这里是code：

I'm trying to create a custom component in angular2/ionic2 which contains an input, here is the code:

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

的问题是，在离子输入似乎在最后的页/图（没有样式施加，甚至无法点击它）被忽略。如果我移动code作为是主视图，然后它的作品。当添加到该自定义组件就像一个按钮

The problem is that the ion-input seems to be ignored in the final page/view (no styles applied, can't even click on it). If I move the code as is to the main view, then it works. When adding to this custom component a button like

<button>ok</button> 

和导入按钮（并将其添加到这个组件太的指示清单）这个作品。所以我不知道，如果一些特别的东西必须做ABOT在自定义组件中使用的ItemInput组件，或者如果我只是打一个bug。

and importing Button (and adding it to the directives list of this component too) this works. So I'm not sure if something special has to be done abot the ItemInput component to be used in a custom component, or if I'm just hitting a bug.

使用离子2.0 alpha49。

Using ionic 2.0 alpha49.

任何线索？

推荐答案

离子导入与指令 IONIC_DIRECTIVES ：

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

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

export class AddInput {
  constructor() {}
}

这篇关于使用自定义组件内部的离子输入的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！