Angular Sort/OrderBy Pipe (Angular v5+)

$3

https://stackblitz.com/edit/angular-sort-orderby-pipe

Install

``
npm install ngp-sort-pipe --save
`

Usage

##### In HTML template

`html
{{ collection | sortBy : asc|desc }} {{ collection | sortBy : asc|desc :
column/property_name }}
`

$3

| Param | Type | Details |
| ------------------------ | ------------------- | ------------------------------- |
| collection | array or object | The collection or array to sort |
| order | string | The Sort Order (asc | desc) |
| property_name (optional) | string | Name of Property to sort by |




Import NgpSortModule to your module

`typescript
import { NgModule } from "@angular/core";
import { BrowserModule } from "@angular/platform-browser";
import { AppComponent } from "./app";

import { NgpSortModule } from "ngp-sort-pipe";

@NgModule({
imports: [BrowserModule, NgpSortModule],
declarations: [AppComponent],
bootstrap: [AppComponent]
})
export class AppModule {}
`

And use pipe in your component

`typescript
import { Component } from "@angular/core";

@Component({
selector: "example",
template:

One dimensional Array

• {{ s }}

Array of Objects (JSON)

Sort by name

• 
  {{ s.id }}-{{ s.name }}
  

Sort by id

• 
  {{ s.id }}-{{ s.name }}
  


})
export class AppComponent {
clientScrips = ["html", "css", "javascript", "angular", "react"];
data = [
{ id: 100, name: "Mike" },
{ id: 104, name: "John" },
{ id: 102, name: "David" },
{ id: 101, name: "Jane" },
{ id: 103, name: "Steve" }
];
}
``