Question

Angular 4申请：

我有一个模型列表，我通过* ngFor创建一些表行。每个模型都有一个包含一些字符串的列表：

{
  ...,
  changes:
  [
    'Test1',
    'Test2'
  ]
}

样本表和* ngFor如下：

<table>
   <tr>
     <th>...</th>
         ...
   </tr>
   <tr *ngFor="let item of list">
        <td ng-class="'cell-changed' : item.changes.indexOf('Test1') !== -1"> 
          {{item?.test1}}</td>
        <td ng-class="'cell-changed' : item.changes.indexOf('Test5') !== -1"> 
          {{item?.test2}}</td>

   </tr>
</table>

这应该做的是，对于每个表定义，需要检查每个项目的更改列表以查看它是否存在。如果确实如此，我希望风格适用，否则不会发生任何事情。我在研究过程中看到的几个例子只是陈述了我上面的内容，但这不起作用。

我已经在javascript中直接测试，看看列表中的值是否是我所期待的，并且我得到了正确的结果。我也只是使用类属性

访问该类

<td class='cell-changed'>...</td>

这意味着它可以看到我的css课程。

我也是这样试过的：

ng-class="item.changes.indexOf('Test1') !== -1 ? 'cell-changed' : ''"

虽然这没有引发错误但它也没有用。我错过了什么？

Answer 1

你正在混合使用AngularJS和Angular方法。如果您使用的是Angular 2+，则应使用[ngClass]代替：

<td [ngClass]="{'cell-changed': item.changes.indexOf('Test5') !== -1}"> 
    {{item?.test2}}
</td>

Answer 2

Angular中不存在

ng-class。这是一个AngularJS指令。

最干净的方法是做那样的事情：

[class.cell-changed]="item.changes.indexOf('Test1') !== -1"

表定义的ng-class无法解析

2 个答案: