は2

2016-05-28 5 views
0

角度でngForから子コンポーネントを生成し、それは角度2にngForの反復から独立した子コンポーネントを作成することは可能ですか?は2

構造体を使用してクイズアプリケーションを作成しています。ここでは、Categoriesのコンポーネントが複数あり、1つのカテゴリには複数のQuestionsがあります。

角度は、ユーザが質問の異なるカテゴリ間で前後に移動し、最終的には部分的に保存したり、完全なフォームを送信することができますRESTのAPIから取得クイズからフォームを生成します。

Iは、アプリケーションテンプレートの次の擬似構造をスケッチ:

<html> 
    <form> 
    <category> 
     <question *ngFor="let question of questions" /> 
    <category> 
    <navigate/> 
    </form> 
</html> 

Quiz componentカテゴリとアクティブカテゴリへの参照のリストを有しています。 Category componentはクイズのアクティブなカテゴリを反映するためにを結合入力されています。 Categoryは、私が個別のコンポーネントにカプセル化したい質問のリストを持っています。したがって、私は質問のリストを繰り返し、質問タグを作成します。

今の問題は、私はそのタグを作成する質問オブジェクトをに従って各タグのQuestion componentを移入する方法、ありますか?これは可能ですか、質問テンプレートをカテゴリとマージする必要がありますか?

答えて

1

input propertyを用いQuestionコンポーネントに質問オブジェクトを渡します。のは、その入力プロパティqObjに名前を付けてみましょう:

あなた Questionコンポーネントで
<question *ngFor="let questionObj of questions" [qObj]="questionObj"></question> 

、入力プロパティを宣言:

import {Component, Input} from '@angular/core'; 
@Component({ 
    selector: 'question', 
    template: `<div>{{qObj.question}}` // I'm assuming it has a question property 
}) 
export class Question { 
    @Input() qObj:Object; 
} 
+0

についてです。この答えが正しかったです –

0

は、私は完全にあなたの質問を理解してかはわからないが、あなたのカテゴリが質問のリストを持っている場合、あなたはあなたのngFor作るべきか、私は、カテゴリ内のngのリピートを示唆

<html> 
    <form> 
    <category ng-repeat="question in $ctrl.questions"> 
     <question/> 
    <category> 
    <navigate/> 
    </form> 
</html> 

の$ CTRLは、参照すべきですあなたのカテゴリーのコントローラーに連絡してください。
このタグの中にquestion変数を使用することができます

+1

質問は角2 –