Tags 离子2/角度2=>；在angular 2组件内使用ionic 2 html标记

我想将Ionic2页面拆分为更小的组件。此外，我还创建了Angular2组件，并将其插入Ionic2页面。参见代码。 如果我现在在Angular2组件中使用Ionic2 HTML标记，我会得到

“”没有值访问器

我的

标记出错

爱奥尼亚网页：

@Page({
  selector: 'game',
  directives: [QuestionComponent, AnswerComponent],
  templateUrl: 'build/pages/quiz/quiz.page.html',
  styles: [`

   `], 
)}
...

<ion-navbar *navbar>
<ion-title>Game: {{game.id}} -> Round {{round}}</ion-title>

import {Component}      from 'angular2/core'
import {Answer}             from "../../../models/answer";
import {AnswerService}      from "../../../services/answer.service";

@Component({
    selector: 'answer',
    providers: [AnswerService],
    templateUrl: 'build/pages/quiz/answer/answer.page.html',
    styles: [`

     `],
})
...

<ion-card>
<ion-card-content>
    <ion-item>
        <ion-label floating>Answer</ion-label>
        <ion-textarea [(ngModel)]="answerText">></ion-textarea>
        <button outline item-right (click)="submitAnswer(answerText)">
            Send
            <ion-icon name="send"></ion-icon>
        </button>
    </ion-item>
</ion-card-content>
</ion-card>

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

import {Answer}             from "../../../models/answer";
import {AnswerService}      from "../../../services/answer.service";

@Component({
    selector: 'answer',
    directives: [IONIC_DIRECTIVES],
    providers: [AnswerService],
    templateUrl: 'build/pages/quiz/answer/answer.page.html',
    styles: [`

     `],
})

爱奥尼亚网页HTML:

@Page({
  selector: 'game',
  directives: [QuestionComponent, AnswerComponent],
  templateUrl: 'build/pages/quiz/quiz.page.html',
  styles: [`

   `], 
)}
...

<ion-navbar *navbar>
<ion-title>Game: {{game.id}} -> Round {{round}}</ion-title>

import {Component}      from 'angular2/core'
import {Answer}             from "../../../models/answer";
import {AnswerService}      from "../../../services/answer.service";

@Component({
    selector: 'answer',
    providers: [AnswerService],
    templateUrl: 'build/pages/quiz/answer/answer.page.html',
    styles: [`

     `],
})
...

<ion-card>
<ion-card-content>
    <ion-item>
        <ion-label floating>Answer</ion-label>
        <ion-textarea [(ngModel)]="answerText">></ion-textarea>
        <button outline item-right (click)="submitAnswer(answerText)">
            Send
            <ion-icon name="send"></ion-icon>
        </button>
    </ion-item>
</ion-card-content>
</ion-card>

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

import {Answer}             from "../../../models/answer";
import {AnswerService}      from "../../../services/answer.service";

@Component({
    selector: 'answer',
    directives: [IONIC_DIRECTIVES],
    providers: [AnswerService],
    templateUrl: 'build/pages/quiz/answer/answer.page.html',
    styles: [`

     `],
})

角度组件HTML:

@Page({
  selector: 'game',
  directives: [QuestionComponent, AnswerComponent],
  templateUrl: 'build/pages/quiz/quiz.page.html',
  styles: [`

   `], 
)}
...

<ion-navbar *navbar>
<ion-title>Game: {{game.id}} -> Round {{round}}</ion-title>

import {Component}      from 'angular2/core'
import {Answer}             from "../../../models/answer";
import {AnswerService}      from "../../../services/answer.service";

@Component({
    selector: 'answer',
    providers: [AnswerService],
    templateUrl: 'build/pages/quiz/answer/answer.page.html',
    styles: [`

     `],
})
...

<ion-card>
<ion-card-content>
    <ion-item>
        <ion-label floating>Answer</ion-label>
        <ion-textarea [(ngModel)]="answerText">></ion-textarea>
        <button outline item-right (click)="submitAnswer(answerText)">
            Send
            <ion-icon name="send"></ion-icon>
        </button>
    </ion-item>
</ion-card-content>
</ion-card>

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

import {Answer}             from "../../../models/answer";
import {AnswerService}      from "../../../services/answer.service";

@Component({
    selector: 'answer',
    directives: [IONIC_DIRECTIVES],
    providers: [AnswerService],
    templateUrl: 'build/pages/quiz/answer/answer.page.html',
    styles: [`

     `],
})

---

我不知道离子，但这对聚合物元素有效，在这里也可能有效-添加

ngDefaultControl

：

<ion-textarea [(ngModel)]="answerText" ngDefaultControl></ion-textarea>

否则，您可能需要实现中提到的自定义

---

另请参见是否确定AnswerComponent类中存在属性

answerText

？

是的，实现

ControlValueAccessor

是一种方法：）谢谢！添加ngDefaultControl解决了错误。但是Ionic2标记无法正确处理此问题。可能存在重复的