angular2：如何循環數字？

我有一個項目集合，其中每個項目都有一個rank屬性，它是一個數字。我婉循環超過這個數字，這裏是我已經試過：angular2：如何循環數字？

<div class="col-md-3 col-sm-4 item-container" *ngFor="let item of items"> 
    <div class="item"> 
     <p class="rank"> 
      <img src="" class="img-responsive" *ngFor="let rank of item.rank"/> 
     </p> 
    </div> 
</div>

打字稿：

export class MonthpicksComponent{ 

    items: Item[] = []; 
    //... 
} 

export class Item{ 
    id: number; 
    name: string; 
    img: string; 
    desc: string; 
    rank: number; 
    voters: number; 
}

但不幸的第一個循環顯示結果只有一個和第二個循環表現出什麼。

來源

2017-10-18 Mohammad

您可能需要爲'items'對象的外觀添加代碼。 Html不足以解決這個問題。 – Sajal

@Sajal檢查更新請 – Mohammad

在控制器中提供項目結構@mohammad – Vignesh

可以使用內部*ngFor功能，所以解決方案應該是這樣的：

.HTML

<li *ngFor='let in of counter(5) ;let i = index'>{{i}}</li>

.TS

counter(i: number) { 
    return new Array(i); 
    }

來源

2017-10-18 08:12:19

試試這個

<div class="col-md-3 col-sm-4 item-container" *ngFor="let item of items"> <div class="item"> <p class="rank"> <img src="" class="img-responsive"/>{{item.rank}} </p> </div> </div>

來源

2017-10-18 08:08:12 Vignesh

你可以這樣做

<li *ngFor='let in of [0,1,2,3,4];let i = index'>{{i}}</li>

來源

2017-10-18 08:33:39

爲了您的具體使用情況，您可以使用此代碼：

HTML：

<div *ngFor="let i of arr(item.rank)"> // arr is declared as Array in our .ts file 
    <img src="" class="img-responsive" 
</div>

.TS：

export class SomeComponent { 
    arr = Array; // declaring arr as Array 
}

arr將獲得您的排名屬性值並創建一個該長度的數組，然後您可以輕鬆循環多次，如您的值所表示的那樣。

試試這個代碼希望它會有幫助。

來源

2017-12-26 12:48:35

angular2：如何循環數字？

回答

相關問題