按字母顺序对对象数组进行排序答案

【问题标题】：Sorting an array of objects alphabetically按字母顺序对对象数组进行排序
【发布时间】：2019-06-15 07:56:31
【问题描述】：

我正在尝试按字母顺序对对象数组进行排序，为了简单起见，我正在使用下面的示例。在我的打字稿中，我会拼接以从数组对象中插入和删除项目。

数组

  cars = [{
        id: 1,
        items: [{
          name: 'car1',
          description: 'this is car1 description'
        },{
          name: 'car2',
          description: 'this is car2 description'
        },{
          name: 'car3',
          description: 'this is car3 description'
        },{
          name: 'car4',
          description: 'this is car4 description'
        },{
          name: 'car5',
          description: 'this is car5 description'
        }]
   }];

html

<p-dataView [value]="cars" [paginator]="true" [rows]="5">
  <p-header>List of Cars</p-header>
  <p-footer>Choose from the list.</p-footer>
  <ng-template let-car pTemplate="listItem">
      <p-fieldset legend="Header" *ngIf="car.id === 1" [toggleable]="true">
          <div *ngFor="let _car of car.items">
              {{_car.name}} - {{_car.description}}
          </div>
      </p-fieldset>
  </ng-template>
</p-dataView>

**********************************************更新************************************ 对不起，我还有一层

  cars = [{
        id: 1,
        items: [{
             Model:[{  
                        name: 'car1',
                        description: 'this is car1 description'
                   }],
             Model:[{  
                        name: 'car2',
                        description: 'this is car2 description'
                   }],

        },
           id:2,
            items: [{

               Model:[{  
                        name: 'car13,
                        description: 'this is car3 description'
                   }],
             Model:[{  
                        name: 'car4',
                        description: 'this is car4 description'
                   }],
        }]
   }];

我试过了

cars[0].items.Model.sort((a,b) => a[0].name > b[0].name ? 1 : -1) //It did not work

也试过

cars[0].items.Model.sort(function (a, b) {
                var nameA = a.name.toLowerCase();
                var nameB = b.name.toLowerCase();
                if (nameA < nameB) //sort string ascending
                    return -1
            })

【问题讨论】：

看看this question。

标签： arrays angular typescript sorting

【解决方案1】：

或者我们可以简化为：

 cars[0].items.sort((a,b) => a.name.localeCompare(b.name))

【讨论】：

【解决方案2】：

cars = [{
        id: 1,
        items: [{
          name: 'ab',
          description: 'this is car1 description'
        },{
          name: 'cd',
          description: 'this is car2 description'
        },{
          name: 'car3',
          description: 'this is car3 description'
        },{
          name: 'aaa',
          description: 'this is car4 description'
        },{
         name: 'car5',
          description: 'this is car5 description'
        }]
   }];

  cars[0].items.sort((a,b) => a.name > b.name ? 1 : -1)

【讨论】：

【解决方案3】：

使用Array.prototype.sort()进行简单排序

cars.sort(function(x,y) {
  if (x.items.name < y.items.name) return -1;
  if (x.items.name > y.items.name) return 1;
  return 0;
})

【讨论】：

【解决方案4】：

我发现使用像 Underscore.js 这样的库来实现这样的实用功能是最有效的：

Underscore.js，特别是 sortBy 方法。

将 underscorejs 添加到您的项目中并将其导入到您的组件中。

import * as _ from 'underscore';

然后调用 sort 方法并传递对象数组和要排序的键。

_.sortBy(car.items, 'name');

当您从 car 数组中添加或删除项目时，请使用 car.items 集合并将其重新分配给 car

car.items = _.sortBy(car.items, 'name');

然后你可以像现在一样显示已排序的数据。

【讨论】：