我可以使用JavaScript/AngularJS使表格单元格中的数字根据其值具有不同的颜色吗
我有一个HTML页面,其中有一个使用Angular我可以使用JavaScript/AngularJS使表格单元格中的数字根据其值具有不同的颜色吗,javascript,jquery,html,css,angularjs,Javascript,Jquery,Html,Css,Angularjs,我有一个HTML页面,其中有一个使用Angularng repeat创建的表和一个获取JSON数据的控制器 以下是我的表格的简化版本: product price ------- ----- ABC $1.33 EDF $2.00 以下是我的HTML页面中的angularJS代码: <table class="table" ng-controller="someCtrl"> <thead> <tr>
ng repeat
创建的表和一个获取JSON数据的控制器
以下是我的表格的简化版本:
product price
------- -----
ABC $1.33
EDF $2.00
以下是我的HTML页面中的angularJS代码:
<table class="table" ng-controller="someCtrl">
<thead>
<tr>
<th>Product</th>
<th>Price</th>
</tr>
</thead>
<tbody>
<tr ng-repeat="p in products">
<td>{{p.productName}}</td>
<td>{{p.price}}</td>
</tr>
</tbody>
</table>
产品
价格
{{p.productName}
{{p.price}}
是否可以根据p.price的值更改其文本颜色?例如,如果p.price>1.5,我想用红色修改价格值
我尝试了以下答案,但只有当我使用ng repeat
硬编码数字而不是动态生成数字时,它才起作用:
如果值=<使用jquery或PHP的特定数字?而不是jquery,可以通过ng class
实现这一点,那么我是否可以使表单元格具有不同的背景颜色
<td><span ng-class="p.price > 1.5 ? 'price-red' : ''">{{p.price}}</span></td>
一种更干净的方法是在angularjs中使用ng class指令。对于标记,您可以根据表达式的值选择提供css类,如下所示:
<td ng-class="{ 'css-cls-for-color1' : p.price > 3000, 'css-cls-for-color2' : p.price <= 3000}"> </td>
你是如何尝试这个链接答案的?给我们看更多的代码。(可以做到,是的。)嗨,我想你可以从这个链接中找到答案@谢谢你!我确实核对了答案,但第一次没有完全明白。但这正是我所需要的!谢谢再次添加相同的答案有什么意义。。正如@Arulkumar所做的一样,方法是不同的。不管怎么说,当我构造我的答案时,Arulkumar没有给出答案,好吗@pankajparkar?我并不是说@Arulkumar也在ng类中计算表达式
nice And simple!谢谢
<td ng-class="{ 'css-cls-for-color1' : p.price > 3000, 'css-cls-for-color2' : p.price <= 3000}"> </td>