Как настроить сортировку массива JSON в Typescript или Angular

Как отсортировать массив JSON в Angular? Массив:

{"title":"DEASDFS","Id":11},
{"title":"AASDBSC","Id":2},
{"title":"JDADKL","Id":6},
{"title":"MDASDNO","Id":3},
{"title":"GHFASDI","Id":15},
{"title":"HASDFAI","Id":1},
{"title":"ASDHFI","Id":9},

Я хочу, чтобы порядок идентификаторов был таким:

15,6,1,11,9,2,3

<div *ngFor="let field of fieldsData;let i=index;">
  <div class="form-inline assigned_text-box" [ngSwitch]="field.Id">

    <div class="col-md-2" *ngSwitchCase="15">
      <label>One</label>
    </div>
    <div class="col-md-2" *ngSwitchCase="6">
      <label>Two</label>
    </div>
    <div class="col-md-2" *ngSwitchCase="1">
      <label>Three</label>
    </div>
    <div class="col-md-2" *ngSwitchCase="11">
      <label>Four</label>
    </div>
    <div class="col-md-2" *ngSwitchCase="9">
      <label>Five</label>
    </div>
    <div class="col-md-2" *ngSwitchCase="2">
      <label>Six</label>
    </div>
    <div class="col-md-2" *ngSwitchCase="3">
      <label>Seven</label>
    </div>

  </div>
</div>

Но когда я использую ngSwitch conditio, n, который когда-либо будет первым, будет печататься, поэтому он будет выглядеть как присутствующий в JSON 11,2,6,3,15,1,9

Но я хочу этот порядок 15,6,1,11,9,2,3. Как я могу получить этот настраиваемый массив сортировки?


person Mr world wide    schedule 30.01.2018    source источник
comment
в какой логике вы его разместите?   -  person Aravind    schedule 30.01.2018
comment
Можете ли вы отсортировать свой массив перед реализацией представления.   -  person Zahid Rahman    schedule 30.01.2018
comment
Массив.прототип.сортировка?   -  person smnbbrv    schedule 30.01.2018
comment
Любой метод подходит, можно ли отсортировать по ngFor div..?   -  person Mr world wide    schedule 30.01.2018


Ответы (1)


Просто отсортируйте массив с помощью Array#sort. метод.

// reference for sort order priority
const ref = {
  15: 0,
  6: 1,
  1: 2,
  11: 3,
  9: 4,
  2: 5,
  3: 6
};

let data = [{
    "title": "DEASDFS",
    "Id": 11
  },
  {
    "title": "AASDBSC",
    "Id": 2
  },
  {
    "title": "JDADKL",
    "Id": 6
  },
  {
    "title": "MDASDNO",
    "Id": 3
  },
  {
    "title": "GHFASDI",
    "Id": 15
  },
  {
    "title": "HASDFAI",
    "Id": 1
  },
  {
    "title": "ASDHFI",
    "Id": 9
  },
];

console.log(
  data.sort((a, b) => ref[a.Id] - ref[b.Id])
)


Или реализовать собственный канал для сортировки: Angular 2 OrderBy Pipe

person Pranav C Balan    schedule 30.01.2018
comment
Простое и чистое решение, спасибо, возможно ли это сделать со стороны просмотра в Angular..? - person Mr world wide; 30.01.2018
comment
@Mrworldwide: вы можете создать собственный канал для сортировки - person Pranav C Balan; 30.01.2018