O'Reilly logo

NativeScript for Angular Mobile Development by Nathanael J. Anderson, Nathan Walker

Stay ahead with the world's most comprehensive technology and business learning platform.

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, tutorials, and more.

Start Free Trial

No credit card required

Creating an Angular Pipe - OrderBy 

Angular provides the Pipe decorator for ease in creating view filters. Let's start by showing how we will use this in the view. You can see that it appears very similar to a command-line pipe used in Unix shell scripts; hence, it's named: Pipe:

<ListView [items]="playerService.tracks | orderBy: 'order'">

This will take the playerService.tracks collection and ensure it is ordered via the order property of each TrackModel for the view display.

Since we may want to use this anywhere in our app views, let's add this pipe as part of CoreModule. Create app/modules/core/pipes/order-by.pipe.ts and here is how we will implement OrderByPipe:

import { Pipe } from '@angular/core';@Pipe({ name: 'orderBy'})export class ...

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, interactive tutorials, and more.

Start Free Trial

No credit card required