如何使用 ng-if 选择类

Question

我有这个ng-repeat：

.HTML：

<td class="border" data-ng-repeat="price in goHead.prices track by $index">

在我的<td> data-ng-if="price.isMinPrice"选择class="border else data-ng-if="! price.isMinPrice"选择class="noBorder"。

在AngularJS中可以做到这一点吗？

Answer 1

是的，这是可能的（您可以使用ng-class）：

<td ng-repeat="price in goHead.prices track by $index" ng-class="{border: price.isMinPrice, noBorder: !price.isMinPrice}">
</td>

或者你可以写：

<td ng-repeat="price in goHead.prices track by $index" class="{{price.isMinPrice ? 'border' : 'noBorder'}}">
</td>

Answer 2

你可以

使用AngularJs ngClass。

<td 
 data-ng-repeat="price in goHead.prices track by $index"
 data-ng-class="{border: price.isMinPrice, noBorder: !price.isMinPrice}">
...
</td>

Answer 3

查看 ng-class

<td class="border"
    data-ng-repeat="price in goHead.prices track by $index"
    ng-class="{border: price.isMinPrice, noBorder: !price.isMinPrice}"
    >
</td>

Answer 4

使用 angularjs 提供的 ngClass 指令。ngClass 指令允许您通过数据绑定表示要添加的所有类的表达式来动态设置 HTML 元素上的 CSS 类。例：

...
<p ng-class="{strike: deleted, bold: important}">Map Syntax Example</p>
<input type="checkbox" ng-model="deleted"> deleted (apply "strike" class)<br>
<input type="checkbox" ng-model="important"> important (apply "bold" class)<br>
...

试试这个，会对你有所帮助。