title: Angular 2 Filter Pipe
body: <p>Trying to write a custom pipe to hide some items.</p>
  
  <pre><code>import { Pipe } from '@angular/core';
  
  // Tell Angular2 we're creating a Pipe with TypeScript decorators
  @Pipe({
      name: 'showfilter'
  })
  
  export class ShowPipe {
      transform(value) {
          return value.filter(item =&gt; {
              return item.visible == true;
          });
      }
  }
  </code></pre>
  
  <p>HTML</p>
  
  <pre><code>&lt;flights *ngFor="let item of items | showfilter"&gt;
  &lt;/flights&gt;
  </code></pre>
  
  <p>COMPONENT</p>
  
  <pre><code>import { ShowPipe } from '../pipes/show.pipe';
  
  @Component({
      selector: 'results',
      templateUrl: 'app/templates/results.html',
      pipes: [PaginatePipe, ShowPipe]
  })
  </code></pre>
  
  <p>My item has the property of visible, which can be true or false.</p>
  
  <p>However nothing showing, is there something wrong with my pipe?</p>
  
  <p>I think my pipe is working because when I change the pipe code to:</p>
  
  <pre><code>import { Pipe } from '@angular/core';
  
  // Tell Angular2 we're creating a Pipe with TypeScript decorators
  @Pipe({
      name: 'showfilter'
  })
  
  export class ShowPipe {
      transform(value) {
          return value;
      }
  }
  </code></pre>
  
  <p>It will show all items.</p>
  
  <p>Thanks</p>