ionic2 in angularjs2について

Question

ION-2ベータ版で1つのアプリケーションを作成します。私はfor-eachループを使いたいです。角度V2でそれぞれ使用できますか？

ありがとうございました。

Answer 1

、あなたが表示したい配列を宣言する必要がComponentでまず：あなたは、コード内の値を変更したい場合は、あなたがやってそれを行うことができます

import { Component } from "@angular/core"; 

@Component({ 
    templateUrl:"home.html" 
}) 
export class HomePage { 

    displayData : []; 

    constructor() { 
    this.displayData = [ 
     { 
     "text": "item 1", 
     "value": 1 
     }, 
     { 
     "text": "item 2", 
     "value": 2 
     }, 
     { 
     "text": "item 3", 
     "value": 3 
     }, 
     { 
     "text": "item 4", 
     "value": 4 
     }, 
     { 
     "text": "item 5", 
     "value": 5 
     }, 
    ]; 
    } 
} 

を：

// We iterate the array in the code 
for(let data of this.displayData) { 
    data.value = data.value + 5; 
} 

そして、あなたのビューでは、このようにそれらを印刷することができます

<ion-content class="has-header"> 
    <ion-list *ngFor="let data of displayData; let i = index" no-lines> 
    <ion-item>Index: {{ i }} - Text: {{ data.text }} - Value: {{ data.value }}</ion-item> 
    </ion-list> 
</ion-content> 

ことを注意してください一部*ngFor="let data of displayData"：

• displayDataは、我々はComponent
• let data of ...で定義された配列は、displayDataアレイの各要素を表すdataと呼ばれる新しい変数を定義しています。
• 変数dataと補間を使用して{{ data.propertyName }}のように各配列要素のプロパティにアクセスできます。