我尝试在angular 2应用程序中实现ng-class-even和ng-class-odd(从angular 1开始)类型的行为。

我已经在下面编写了代码,并且可以正常工作,我想知道是否还有其他方法可以做到这一点。

的HTML

<div *ngFor="#employee of employees; #index = index" [class.odd]="index%2==1" [class.even]="index%2==0" [class.selected]="employee === selectedEmployee">
      <p>{{employee.name}}</p>
         </div>

的CSS
.odd {
    background-color: #f2f9ff;

}
.even {
    background-color: #eceff3;
}

最佳答案

旧方式
DEMO :http://plnkr.co/edit/YkcudQipF1c8iT5LCRyd?p=preview

<div *ngFor="#employee of employees;
             #index =index;
             #isOdd=odd;
             #isEven=even"

     [class.odd]="isOdd"
     [class.even]="isEven"
     [class.selected]="employee === selectedEmployee">
     <p>{{employee.name}}</p>
</div>

新方法

替换 # let (关键字)
<div *ngFor="let employee of employees;
             let index =index;
             let isOdd=odd;
             let isEven=even"

      [class.odd]="isOdd"
      [class.even]="isEven"
      [class.selected]="employee === selectedEmployee">
      <p>{{employee.name}}</p>

</div>

关于angularjs - 为angular 2实现ngClassEven ngClassOdd,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/36314261/

10-13 00:44