Ngx-orderby-ts

Order your collection by a single or multiple fields in .ts file. The image below shows the multiple columns sorting. First order birthday then name descending order. This library was generated with Angular CLI version 9.0.7.

Install

npm install ngx-orderby-ts --save

Usage

This component is used to sort a collection using a single column, multiple columns in ascending and descending order. For deep sorting you have to use dot to indicate the path to the property.

Type	Description
single	sorting a collection using a single column
multiple	sorting a collection using a multiple columns

The following types can be used for sorting: string, integer, number, number in a string format, boolean, date (must be ISO_8601), object

Import OrderBy into your component (.ts)

1import { OrderBy } from 'ngx-orderby-ts';

Using single column soring in your component (.ts) file

1const singleResult = OrderBy.sortSingle(collection, 'id');

Using multiple columns soring in your component (.ts) file

1const multipleResult = OrderBy.sortMultiple(collection, ['birthday', 'name']) ;

Example

Using multiple columns soring in your .ts file. The result is showed in the above image.

1import { Component, OnInit } from '@angular/core';
2import { OrderBy } from 'ngx-orderby-ts';
3
4@Component({
5  selector: 'app-root',
6  templateUrl: './app.component.html',
7  styleUrls: ['./app.component.scss']
8})
9export class AppComponent {
10  constructor() { 
11    const collection: any[] = [
12      {
13        id: 1,
14        info: {
15          name: 'Ryan',
16          number: '123-342',
17          birthday: '2007-12-09'
18        }
19      },
20      {
21        id: 4,
22        info: {
23          name: 'Justin',
24          number: '123-567',
25          birthday: '2007-12-09'
26        }
27      },
28      {
29        id: 3,
30        info: {
31          name: 'Luke',
32          number: '234-8765',
33          birthday: '2007-12-09'
34        }
35      },
36      {
37        id: 2,
38        info: {
39          name: 'Samuel',
40          number: '234-3241',
41          birthday: '2009-08-14'
42        }
43      },
44      {
45        id: 5,
46        info: {
47          name: 'Zipora',
48          number: '435-1234',
49          birthday: ''
50        }
51      }
52    ];
53
54    const result = OrderBy.sortMultiple(collection, ['info.birthday', '-info.name']);
55  }
56}

License

MIT