2017-05-31 5 views
0

APIから返される以下の形式の巨大な配列を持っていますが、ループしてモバイルアプリに表示する必要があります。私がangle2でこれを行う方法はありますか?(初心者です)Ionic3フレームワークのAPIから返された配列をループする方法

私がJSON形式を使用していないのは、データが巨大なので郵便配達で実行したときにデータを返さないからです。直接イオン3フレームワークの配列をループとAngular2

Array 
    (
    [0] => Array 
     (
     [SubjectID] => 16 
     [QuestionID] => 4358 
     [QuestionType] => 
     [Question] => Which one is a wrong statement? 
     [Answer1] => some answer1. 
     [Answer2] => some answer2 
     [Answer3] => some answer3 
     [Answer4] => some answer4 
     [CorrectAnswer] => 4 
     [Hint] => 
     [DiffLevel] => Medium 
     [Status] => Active 
     [AnsDescription] => some description. 
    ) 

[1] => Array 
    (
     [SubjectID] => 16 
     [QuestionID] => 4359 
     [QuestionType] => SingleAnswer 
     [QuestionType] => 
     [Question] => Which one is a wrong statement? 
     [Answer1] => some answer1. 
     [Answer2] => some answer2 
     [Answer3] => some answer3 
     [Answer4] => some answer4 
     [CorrectAnswer] => 4 
     [Hint] => 
     [DiffLevel] => Medium 
     [Status] => Active 
     [AnsDescription] => some description 
    ) 

) 

これは私.TSファイルである:「角度/コア@」から インポート{コンポーネント}。 'ionic-angular'からimport {NavController}を実行します。

@Component({ 
selector: 'page-about', 
templateUrl: 'about.html' 
}) 
export class AboutPage { 
items:any[]; 

constructor(public navCtrl: NavController) { 
} 

this.items = 
} 

私はこのデータをループしてアプリケーションに表示する方法を見つける必要があります。前もって感謝します !! いくつかの回答を楽しみにしています。

答えて

0

はなぜuはフロントエンドでキーを使用していけない:

<div *ngFor="#elem of data"> 
    <div [(ngModel)]="elem.SubjectId" 
</div> 

それとも、そのためTobias..Thanks @data.forEach(elem => { ... })機能

+0

を使用することができ、私はちょうど私のtypescriptファイルとの質問を更新しましたそれが正しく動作するかどうかだけをチェックするために、私の配列をエクスポートクラスの項目に割り当て、* ngForを ".html"ファイルに使用できますか? –

2
<div *ngFor="let item of items"> 
    <div [(ngModel)]="item.QuestionID"> {{item.Question}} </div> 
</div> 

In Class Function you can use 
this.items.forEach((item, index) => { ... }) 
関連する問題