当前位置: 首页 > 面试题库 >

角顺序按数字以ng-repeat中的文本排序

鲍鸿波
2023-03-14
问题内容

我有此数据:

[{"id":"42","firstname":"Sarah","lastname":"Dilby","age":"40","cars":"Yaris"},
{"firstname":"Jason","lastname":"Diry","age":"5","id":"5"},
{"id":"6","firstname":"Bilson","lastname":"Berby","age":"1","cars":"Tipo"}]

当我通过ng-
repeat按id或按年龄排序时,它会将数字排序为文本。由于我找不到它写的任何地方的问题,所以我猜我的代码有问题。我创建了这个小提琴:http
:
//jsfiddle.net/vsbGH/1/很抱歉,该模板,但jsfiddle不允许在html框中使用。无论如何,这是加载和排序数据的代码:

//user data
app.service('People', function() {
var People = {};
People.details = [{"id":"42","firstname":"Sarah","lastname":"Dilby","age":"40","cars":"Yaris"},
                  {"firstname":"Jason","lastname":"Diry","age":"5","id":"5"},
                  {"id":"6","firstname":"Bilson","lastname":"Berby","age":"1","cars":"Tipo"}]
return People;
});

//list ctrl
controllers.listCtrl = function ($scope,People) {
 $scope.people = People.details;

 $scope.sortList = function(sortname) {
    $scope.sorter = sortname;
 }
}

这是模板的ng-repeat部分:

<tr ng-repeat="person in people | orderBy:sorter ">
        <td>{{person.id | number}}</td>
        <td>{{person.firstname}} </td>
        <td>{{person.lastname}} </td>
        <td>{{person.age | number}}</td>
        <td>{{person.cars}} </td>
 </tr>

非常感谢您能帮助我理解为什么数字数据不按数字排序以及为什么不按文本排序。


问题答案:

我认为最合适的解决方案是正确格式化JSON对象上的数字,即不要将其用引号引起来。所以:

 [{"id":"42","firstname":"Sarah","lastname":"Dilby","age":"40","cars":"Yaris"},
  {"firstname":"Jason","lastname":"Diry","age":"5","id":"5"},
  {"id":"6","firstname":"Bilson","lastname":"Berby","age":"1","cars":"Tipo"}]

变成:

[{"id":42,"firstname":"Sarah","lastname":"Dilby","age":40,"cars":"Yaris"},
 {"firstname":"Jason","lastname":"Diry","age":5,"id":5},
 {"id":6,"firstname":"Bilson","lastname":"Berby","age":1,"cars":"Tipo"}]

我猜想SergL的解决方案是好的,如果不可能更正JSON数据的格式。

除此之外,在我的特定情况下,问题与服务器端PHP的json_encode函数有关。默认情况下,它将数字视为字符串。要修复,我必须JSON_NUMERIC_CHECK在PHP脚本中将选项添加到encode方法:

json_encode($assoc_array,JSON_NUMERIC_CHECK);


 类似资料:
  • 我有这个数据: 当我在ng-repeat中按id或按年龄排序时,它将数字作为文本排序。因为我找不到任何地方写着这是一个问题,我猜想是我的代码有问题。我已经创建了这个小提琴:http://jsfiddle.net/vsbGH/1/抱歉的模板,但jsfiddle不允许在html框中。总之,这是加载和排序数据的代码: 这是模板的ng重复部分: 如果你能帮助我理解为什么数字数据不按数字排序,而按文本排序,

  • 问题内容: 如何按键排序为整数? 我有以下对象; HTML: 当前的输出顺序是 但是我想要 不要为我工作。 有任何想法吗? 谢谢! 问题答案: 一种选择是使用中间过滤器。 代码和代码段 注意: 上面的过滤器需要Underscore.js,如果不使用它,可以重写过滤器。

  • 问题内容: 我正在创建一个测验,每当我开始测验时,我都希望将问题打乱,以免每次出现时都不会以相同的顺序出现。 我在我的html代码中有这个: 这在我的控制器中 不幸的是,这根本没有用。希望有人可以帮助我吗? 问题答案: 谢谢 http://bost.ocks.org/mike/shuffle/ 使用此改组功能: 它的特殊之处在于,输入数组保持可绑定性,因为改组不会创建新的数组,而是 对同一引用 执

  • 问题内容: 我有一个HTML表格,想通过单击表格标题(在ctrl中)对记录(在ctrl中)进行排序, 任何人都可以解释为什么这样做有效: 那不是: 这是记录的代码: 我的表格中有58列,因此遍历表格标题会更好。 问题答案: 正如David所建议的,这可能与范围有关。由于ngRepeat创建了一个新的作用域,因此您需要为每个列标题设置和。 确保您在同一范围内修改值的一种方法是在该范围内创建一个函数,

  • 问题内容: 我有一个用户模型和一个提交模型。每个提交都有一个上载用户的外键字段user_submitted。 我的问题很简单:如何获得提交量最多的三个用户的列表? 我尝试在用户模型上创建num_submissions方法: 然后执行: 但这失败了,就像我尝试过的所有其他尝试一样。我实际上可以使用智能数据库查询吗?还是我应该在视图文件中做些更怪异的事情? 问题答案: 你没有在示例模型代码中提及,但在

  • 问题内容: myArray = [Step 6, Step 12, Step 5, Step 14, Step 4, Step 11, Step 16, Step 9, Step 3, Step 13, Step 8, Step 2, Step 10, Step 7, Step 1, Step 15] 如何以这种方式在上面对这个数组排序? 我很快使用了此功能,但它是按这种方式排序的 问题答案: 另