按对象属性数值对数组中的对象重新排序答案

【问题标题】：Reorder the objects in an array by object property numeric values按对象属性数值对数组中的对象重新排序
【发布时间】：2018-08-31 05:47:59
【问题描述】：

我正在使用一个在 typescript 上运行的 ionic cordova 应用程序。我有一个对象数组。每个对象都包含一个位置的信息。每个位置的字段之一是以英里为单位的用户距离。将这些位置打印到模板时，我需要按照从最小距离到最大距离的顺序打印它们。我是打字稿的新手。

这是我的对象数组的示例：

    (7) [Object, Object, Object, Object, Object, Object, Object]
    0:Object
        distance:17.24
        emails:"someemail@email.com, anotheremail@email.com"
        location_adress:"555 Address Road, San Antonio, TX, United States"
        location_city:"San Antonio"
        location_fax:"555-555-5551"
        location_id:"1"
        location_image:"http://CDN/path/to/image1.jpg"
        location_latitude:"29.3778525"
        location_longitude:"-98.50377409999999"
        location_name:"Some Name1"
        location_phone:"555-555-5551"
        location_state:"Texas"
        location_status:"1"
        location_street:"555 Address Road"
        location_zip_code:"78214"
        __proto__:Object
    1:Object
        distance:19.994
        emails:"someemail@email.com, anotheremail@email.com"
        location_adress:"556 Address Road, San Antonio, TX, United States"
        location_city:"San Antonio"
        location_fax:""
        location_id:"3"
        location_image:"http://CDN/path/to/image2.jpg"
        location_latitude:"29.4592474"
        location_longitude:"-98.64008209999997"
        location_name:"Some Name2"
        location_phone:"555-555-5552"
        location_state:"Texas"
        location_status:"1"
        location_street:"556 Address Road"
        location_zip_code:"78251"
        __proto__:Object
    2:Object
        distance:14.19
        emails:"someemail@email.com, anotheremail@email.com"
        location_adress:"557 Address Road, San Antonio, TX, United States"
        location_city:"San Antonio"
        location_fax:""
        location_id:"4"
        location_image:"http://CDN/path/to/image3.jpg"
        location_latitude:"29.45775019999999"
        location_longitude:"-98.5540115"
        location_name:"Some Name3"
        location_phone:"555-555-5553"
        location_state:"Texas"
        location_status:"1"
        location_street:"557 Address Street"
        location_zip_code:"78228"
        __proto__:Object
    ...... ect...

如何按组件文件中从最小到最大的距离对这些对象进行排序？然后我会将正确的顺序打印到我的模板中。

这是我的模板中用于打印对象的块：

  <ion-col col-12 col-sm-6>

    <div class="list-results">

      <div class="zip-result" *ngFor="let item of dataSet" (click)="push(item.location_id)">
        <p class="location-name">{{item.location_name}}</p>
        <p class="address"><ion-icon name="navigate-outline"></ion-icon> {{item.location_adress}}</p>
        <p class="go-to-location">
            <ion-icon name="arrow-forward" ></ion-icon>
        </p>
      </div>
    </div>
  </ion-col>

这看起来很简单，但除了“angular2+ 不允许 orderBy”之外我找不到任何东西，如果我可以在组件文件中重新排序它们也没什么大不了的。有什么想法吗？

【问题讨论】：

标签： angular typescript ionic3 javascript-objects

【解决方案1】：

对于数组，您可以只使用sort，但如果添加新项目作为具有排序顺序的视图绑定，这不会自动更新：

list.sort((a, b) => a.distance - b.distance);

【讨论】：

非常感谢，这让我走了：this.dataSet = newArr.sort(function(a, b) { return parseFloat(a.distance) - parseFloat(b.distance); }) ;
很高兴为您提供帮助:)

【解决方案2】：

这就是魔法：

    this.dataSet = newArr.sort(function(a, b) {
        return parseFloat(a.distance) - parseFloat(b.distance);
    });

【讨论】：