ng在行和列上使用ngClass问题

be-*_*ied 15 ngfor angular

我正在使用Angular2及其ngFor.我想将类添加到奇数行和偶数行,因此我可以通过颜色将它们分开.

这是我的代码(实际上不起作用):

<div *ngFor="#meeting of meetingList; #index=index; #odd=odd; #even=even;"
  class="row"
  [ngClass]="{ odd: odd, even: even }
">
  <div class="col"></div>
  <div class="col"></div>
</div>
Run Code Online (Sandbox Code Playgroud)

虽然如果我这样做,代码工作:

<div *ngFor="#meeting of meetingList; #index=index; #odd=odd; #even=even;"
  class="row"
">
  <div class="col" [ngClass]="{ odd: odd, even: even }"></div>
  <div class="col" [ngClass]="{ odd: odd, even: even }"></div>
</div>
Run Code Online (Sandbox Code Playgroud)

有没有更好的方法将类放入行而不是列?先感谢您.

Gün*_*uer 39

你的第一个代码示例是正常的Plunker示例

@Component({
  selector: 'my-app',
  styles: [`
    .even { color: red; }
    .odd { color: green; }
    `],
  template: `
  <h2>Hello {{name}}</h2>
  <div *ngFor="let meeting of meetingList; let index=index; let odd=odd; let even=even;"
      class="row"
      [ngClass]="{ odd: odd, even: even }">{{meeting}}
    <div class="col"></div>
    <div class="col"></div>
  </div>
`
})
export class App {
  meetingList = ['a', 'b', 'c'];
}
Run Code Online (Sandbox Code Playgroud)

在此输入图像描述