首页 文章

表定义的ng-class无法解析

提问于
浏览 次
1

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中直接测试，看看列表中的值是否是我所期待的，我得到了正确的结果 . 我也只是使用class属性访问该类

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

这意味着它看到了我的CSS课程 .

我也这样试过：

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

虽然这没有抛出错误但它也没有用 . 我错过了什么？

angular html-table ng-class

2 回答

  • 0

    你're mixing AngularJS and Angular approach. If you'重新使用Angular 2你应该使用 [ngClass] 代替：

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

    Angular中不存在 ng-class . 这是一个AngularJS指令 .

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

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

相关问题