2017-10-02 5 views
0

私の*ngFor私は項目を動的に作成します。 いくつかの入力がありますので、私が必要とするのは入力をトラバースする方法です。私は助けや示唆が必要です。私は動的にはイオンの入力を横切ります3

<ion-list item-start *ngFor="let nivel of niveles" id="asistencia"> 
       <ion-item> 
        <ion-label color="primary" class="niveles">{{nivel.nivel}}</ion-label> 
        <ion-label color="danger" class="niveles">{{nivel.codigoModular}}</ion-label> 
       </ion-item> 
       <ion-item> 
        <ion-label>Docentes que deben Asistir</ion-label> 
       </ion-item> 
       <ion-item> 
        <ion-label> 
         <ion-icon color="primary" name="school"></ion-icon> 
        </ion-label> 
        <ion-input type="number"> 
        </ion-input> 
       </ion-item> 
       <ion-item> 
        <ion-label>Docentes que Asistierón</ion-label> 
       </ion-item> 
       <ion-item> 
        <ion-label> 
         <ion-icon color="primary" name="school"></ion-icon> 
        </ion-label> 
        <ion-input type="number"> 
        </ion-input> 
       </ion-item> 
       <ion-item> 
        <ion-label>Alumnos que deben Asistir</ion-label> 
       </ion-item> 
       <ion-item> 
        <ion-label> 
         <ion-icon color="danger" name="contacts"></ion-icon> 
        </ion-label> 
        <ion-input type="number"> 
        </ion-input> 
       </ion-item> 
       <ion-item> 
        <ion-label>Alumnos que Asistierón</ion-label> 
       </ion-item> 
       <ion-item> 
        <ion-label> 
         <ion-icon color="danger" name="contacts"></ion-icon> 
        </ion-label> 
        <ion-input type="number"> 
        </ion-input> 
       </ion-item> 
      </ion-list> 

enter image description here

答えて

1

入力を作成した場合 あなたはそれがIonic and Formsを使用して簡単に行うことができます。

2-way data bindingまたはreactive formのいずれかの方法を使用できます。上記の公式ドキュメントを参照してください。

これは、あなたのユースケースに変換することができますちょうどexample.Hopeです:

2ウェイデータバインディング方法:

.htmlを

<form (ngSubmit)="logForm()"> 
     <ion-item> 
     <ion-label>Todo</ion-label> 
     <ion-input type="text" [(ngModel)]="todo.title" name="title"></ion-input> 
     </ion-item> 
     <ion-item> 
     <ion-label>Description</ion-label> 
     <ion-textarea [(ngModel)]="todo.description" name="description"></ion-textarea> 
     </ion-item> 
     <button ion-button type="submit" block>Add Todo</button> 
    </form> 

。 t

export class FormsPage { 
    todo = {} 
    logForm() { 
    console.log(this.todo) 
    } 
} 
+0

あなたは私を理解できませんでした。私は項目を動的に生成します。これらは入力とボタンで読み込む必要があります。 –

+0

はい、上記のようにモデルを定義し、そのモデルを保存ボタンで使用する必要があります。 logForm(){ console.log(this.todo) } ' – Sampath

関連する問題