次のボタンを使用してngForで配列をループする

Question

Ionic 3の新機能 - ngForを使用すると配列をループしたいと思っています。私は一度に配列から1つの項目を表示するスライスメソッドを使用しました。私は、「次へ」ボタン」をクリックすると、配列内の次の項目を表示しているよ。

<div *ngFor="let reference of content | slice:0:1;"> 
<div> {{reference.item}} </div> 
<div> {{reference.image}} </div> 
<div> {{reference.field2}} </div> 

<button ion button> Next </button> 

ないngForが最善のアプローチであるか、より良い代替手段があるかどうか確認します。ありがとうございます！

あなたがリストとして、すべてのデータを表示したくない場合は

Answer 1

、あなたはここにngForを必要としない。 あなたが次の各ボタンのクリックにインクリメントしますインデックスを指定してデータを表示するだけのことができます。

reference:any; 
currentIndexToShow:number = 0; 

nextButtonClick() { 

    this.currentIndexToShow++; 
    this.reference = content[currentIndexToShow]; 

} 

<div> {{reference?.item}} </div> 
<div> {{reference?.image}} </div> 
<div> {{reference?.field2}} </div>