在Angular2組件的HTML模板中實現計數器

Question

我正在嘗試構建自定義日曆。還有很多事情要做，但我在這方面的問題是如何在Angular2組件中的HTML模板中實現一個計數器。更具體地：

<div class="container"> 
    <table class="table table-bordered"> 
    <tbody> 
     <tr *ngFor="let w of weeks"> 
      <td *ngFor="let d of days"> 
       <ng-container *ngIf="(day_count <= monthLength && (w > 1 || d >= firstDayOfMonth))"> 
        {{ day_count }} 
        // On this point, I want "day_count = day_count + 1"... 
       </ng-container> 
      </td> 
     </tr> 
    </tbody> 
</table> 
</div> 

關於上述變量：

weeks = [1,2,3,4,5,6]; 
days = [0,1,2,3,4,5,6]; 
monthLength = 28 or 29 or 30 or 31 
firstDayOfMonth = from 0 to 6 

變量「DAY_COUNT」是變量負責顯示該月的每個日期。最初，它必須是1，然後增加1等，直到達到monthLength。那麼，我怎樣才能使這個實現？

Answer 1

你不能這樣做沒有模板側，

但我認爲你需要爲你的代碼的解決方案是：

模板側：

<div class="container"> 
    <table class="table table-bordered"> 
    <tbody> 
     <tr *ngFor="let w of weeks"> 
      <td *ngFor="let d of days"> 
       <ng-container *ngIf="incr(w,d,monthLength,firstDayOfMonth)"> 
        {{ incr(w,d,monthLength,firstDayOfMonth) }} 
       </ng-container> 
      </td> 
     </tr> 
    </tbody> 
</table> 
</div> 

元件面：

weeks = [1,2,3,4,5,6]; 
days = [0,1,2,3,4,5,6]; 
firstDayOfMonth = 0; 
monthLength = 31; 

incr(w,d,monthLength,firstDayOfMonth) 
{ 
    let day_count = ((w-1)*7)+d; 
    if (day_count < (monthLength+firstDayOfMonth) && day_count >= firstDayOfMonth) 
    { 
     return day_count - firstDayOfMonth+1; 
    } 
}