You need to enable JavaScript to run this app. AngularJS中如何按id字段对JSON对象数组排序并赋值给新scope变量
优惠活动
大模型
产品
解决方案
定价
更多

AngularJS中如何按id字段对JSON对象数组排序并赋值给新scope变量

问题根因
  • 你的id字段为字符串类型,虽然减法运算会隐式转换为数字,但存在隐式转换异常的风险,是排序不符合预期的潜在诱因
  • 控制台打印看起来未排序的常见原因是浏览器控制台输出的是数组引用,展开时才会读取数组的实时值,可通过打印JSON序列化后的内容确认排序结果
  • 你直接执行$scope.newCitySort = $scope.cityData属于引用赋值,两个变量指向同一个数组对象,没有生成独立的排序结果副本
  • 数组的sort()方法是原地排序,会直接修改原数组,若要保留原数组的原始顺序,需要先拷贝数组再排序
实现代码
// 场景1:不需要保留原cityData的原始顺序,直接排序后生成新副本
$scope.cityData.sort(function (a, b) {
  // 手动转换为数字,避免字符串隐式转换异常
  return Number(a.id) - Number(b.id);
});
// 浅拷贝数组生成独立副本赋值给新变量
$scope.newCitySort = $scope.cityData.slice();

// 场景2:需要保留原cityData的原始顺序,先拷贝再排序
$scope.newCitySort = [...$scope.cityData].sort(function (a, b) {
  return Number(a.id) - Number(b.id);
});

// 打印排序快照确认结果
console.log(JSON.stringify($scope.newCitySort));
补充说明
  • 如果id字段存在非数字前缀等特殊格式,可以改用parseInt(a.id, 10)做整数转换,适配性更强
  • 浅拷贝数组的方式除了slice()、扩展运算符[...arr],也可以用Array.from(arr),都适配你当前数组元素为简单对象的场景
  • 不要直接对原数组做赋值操作,避免两个变量绑定同一份引用导致后续操作互相影响

内容的提问来源于stack exchange,提问作者Kumara

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.10.20 05:36:05