title: Angular2 sorting array for displaying in *ngFor in html
body: <p>I am looping through all the posts</p>
  
  <pre><code>&lt;li *ngFor="let post of posts"&gt;
  </code></pre>
  
  <p>When displaying the date for each post I do:</p>
  
  <pre><code>{{post.date | date:'yyyy-MM-dd HH:mm:ss'}}
  </code></pre>
  
  <p>What I want to do is display all the posts in order of newest first.</p>
  
  <p>I have tried using a pipe like:</p>
  
  <pre><code>&lt;li *ngFor="let post of posts | order-by-pipe"&gt;
  </code></pre>
  
  <hr>
  
  <pre><code>import {Pipe, PipeTransform} from '@angular/core';
  
  @Pipe({
   name: 'order-by-pipe'
  })
  export class OrderByPipe implements PipeTransform{
  
   transform(array: Array&lt;string&gt;, args: string): Array&lt;string&gt; {
  
    if(!array || array === undefined || array.length === 0) return null;
  
      array.sort((a: any, b: any) =&gt; {
        if (a.date &lt; b.date) {
          return -1;
        } else if (a.date &gt; b.date) {
          return 1;
        } else {
          return 0;
        }
      });
      return array;
    }
  
  }
  </code></pre>
  
  <p>But it does not work. I get the error:</p>
  
  <pre><code>TypeError: Cannot read property 'toUpperCase' of undefined ("
  [ERROR -&gt;]*ngFor="let post of posts | order-by-pipe"&gt;
  </code></pre>
  
  <p>Any help would be welcome, thanks</p>