Coming soon!

Angular2 OrderBy Pipeline

When you start building an Angular2 application you quickly notice that you are not able to find the OrderBy filter (pipeline directive). For example in the first version of Angular we could do something like this: <ul ng-repeat="friend in friends | filter:query | orderBy: 'name' "> <li>

  • Angular2
  • javascript
  • typescript

By Joris Brauns · 8/27/2016 6:40:08 PM (Original Post)

When you start building an Angular2 application you quickly notice that you are not able to find the OrderBy filter (pipeline directive). For example in the first version of Angular we could do something like this:

  • {{friend.name}}

The reason for this appears to be that the orderby relies on reflection. One of Angular2 its goal is goal is to work with minifiers. And so they have been staying away from these kind of things since this will break the minification.

You can read Miško Hevery remark here on github:
https://github.com/angular/angular/pull/2956#issuecomment-175412839

How are we going to solve this obstacle? We build it our self!
Here is a very nice tutorial on how you can achieve this.
http://www.fueltravel.com/blog/migrating-from-angular-1-to-2-part-1-pipes/

Are you to lazy to continue reading? No problem, grab the source code over here:
https://plnkr.co/edit/DHLVc0?p=preview


  • Angular2
  • javascript
  • typescript

By Joris Brauns · 8/27/2016 6:40:08 PM (Original Post)

Share this blogpost

Looking for talent?

Fill in the form below and we’ll get back to you as soon as possible.

Oops. You seem to have written your full name in invisible ink. Please enter it so we can read it. Oops. You seem to have written your company in invisible ink. Please enter it so we can read it. It seems your e-mail doesn’t exist. Please enter a real one so we can contact you. Oops. You seem to have written your telephone in invisible ink. Please enter it so we can read it.