繁体   English   中英

如何使用Angular.js根据数字值对表格进行排序?

[英]How to sort table as per the number value using Angular.js?

我需要使用Angular.js按照包含某些数字类型值的每一列对表行值进行排序。 我在下面提供我的代码。

<tr ng-repeat="c in clickSummary">
   <td>{{$index+1}}</td>
   <td>{{c.rest_name}}</td>
   <td>{{c.page_hit}}</td>
   <td>{{c.map_hit}}</td>
   <td>{{c.gallery_hit}}</td>
   <td>{{c.web_hit}}</td>
   <td>{{c.total}}</td>
</tr>   

这里的clickSummary对象包含一些数据数组。上面的表输出如下所示。

sl no    name    page hit   map hit     gallery hit    web hit    total

1        aaa       1             1         0             1          3

2        bbb       2             2         1              0          5

3        ccc       1             2         3              0           6

4        ddd       1             3         0              0            4

5       eee        2             4         1              2            9

我需要根据total列值进行排序,这意味着它应该以降序排列( 9,6,5,4,3 )。

orderBy按过滤器:

<tr ng-repeat="c in clickSummary | orderBy:['-total','+rest_name'] ">

这是一个现场演示

角度顺序通过Docs

通过表达式谓词对指定数组进行排序。 字符串按字母顺序排列,数字按数字顺序排列。 注意:如果您发现数字未按预期进行排序,请确保将其实际保存为数字而不是字符串。 还支持类似数组的值(例如,NodeList,jQuery对象,TypedArrays,String等)。

您可以使用|使用angularJS默认过滤器 字符

<tr ng-repeat="c in clickSummary | orderBy:'-total'">
   <td>{{$index+1}}</td>
   <td>{{c.rest_name}}</td>
   <td>{{c.page_hit}}</td>
   <td>{{c.map_hit}}</td>
   <td>{{c.gallery_hit}}</td>
   <td>{{c.web_hit}}</td>
   <td>{{c.total}}</td>
</tr>  

如果要对多个项目进行排序,则可以创建一个数组,例如total和name:

<tr ng-repeat="c in clickSummary | orderBy:['-total','name']">
   <td>{{$index+1}}</td>
   <td>{{c.rest_name}}</td>
   <td>{{c.page_hit}}</td>
   <td>{{c.map_hit}}</td>
   <td>{{c.gallery_hit}}</td>
   <td>{{c.web_hit}}</td>
   <td>{{c.total}}</td>
</tr>  

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM