AngularJS-对其中包含数字的字符串进行ng-repeat排序 [英] AngularJS - Sorting ng-repeat on string with numbers in them

查看:180
本文介绍了AngularJS-对其中包含数字的字符串进行ng-repeat排序的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我在表格视图中有一个对象列表,我想对其进行正确排序.

I have a list of objects in a table-view i would like to sort properly.

除其他事项外,我的对象还包含一个名称字段.此名称字段也可以包含数字,例如: Chairman Seat 1 Seat 2 Seat 3 Seat 11 Seat 12 Seat 23 Secretary

Amongst other things, my objects contain a name-field. This name field can also contain numbers, so for example: Chairman Seat 1 Seat 2 Seat 3 Seat 11 Seat 12 Seat 23 Secretary

然而,排序如下: Chairman Seat 1 Seat 11 Seat 12 Seat 2 Seat 23 Seat 3 Secretary

This is however sorted like this: Chairman Seat 1 Seat 11 Seat 12 Seat 2 Seat 23 Seat 3 Secretary

按名称排序时,这似乎不是对列表进行排序的自然方法.

This doesn't seem like a natural way of sorting my list when sorting by name.

现在我正在像这样使用ng-repeat: seat in seats | orderBy:orderField:orderReverse track by seat.id orderfield是单击表标题时设置的某个变量,而orderReverse也是可逆的.

Now i'm using the ng-repeat like this: seat in seats | orderBy:orderField:orderReverse track by seat.id Where orderfield is some variable that is set when clicking the table header and orderReverse is too for reversing.

我尝试制作一个自定义过滤器,以确保其行为正常,但我失败了.除非我将字符串分解,否则似乎Javascript不会正常进行排序.但是我不希望因为数据经常通过轮询来更新.另一种方法是强制前导零,但是由于用户是手动输入此内容,所以我不确定是否应该这样做.

I've tried making a custom filter to makes sure it behaves properly but i failed. It seems that Javascript just won't order it normally unless i break up the string. But i'd rather not because the data is often updated by polling. Another way would be to force leading zero's but since users are entering this stuff manually i'm not sure if i should.

而且,它不仅是带有数字的名称,所以我不能完全切断它们

Also, its not only names with numbers in them, so i can't just completely cut them off

那么,关于如何正常显示此列表的任何建议?

So, any suggestions on how to make this list show normally?

清除了有关该问题的一些信息.

cleared up some info about the problem.

推荐答案

您可以在orderBy中使用自定义排序功能(也可以使用自定义排序功能)

You can use a custom sort function with orderBy (it can take custom sorting function too)

在控制器中定义排序功能:

define a sort function in your controller:

$scope.sorter = function (a){
   return parseInt(a.replace( /^\D+/g, '')); // gets number from a string
}

,然后在您的模板中

seat in seats | orderBy:sorter track by seat.id

根据修改后的问题说明进行

编辑:

Edit as per the modified problem statement:

在控制器中进行手动排序,而不是使用 naturalSort 进行ng-repeart排序

Do manual sorting in controller instead of with ng-repeart using naturalSort

$scope.seats = [{"id": "Seat 12"},{"id": "Seat 3"},{"id": "Seat 1"},{"id": "Seat 2"},{"id": "Secretary"}];
$scope.seats.sort(function(a,b) {
    return naturalSort(a.id, b.id);
})

或检查此角度模块 http://blog.overzealous.com/post/55829457993/natural-sorting-within-angular-js 和展示它的小提琴- http://jsfiddle.net/wE7H2/3/

or check this angular module http://blog.overzealous.com/post/55829457993/natural-sorting-within-angular-js and the fiddle demonstrating it - http://jsfiddle.net/wE7H2/3/

这篇关于AngularJS-对其中包含数字的字符串进行ng-repeat排序的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆