Angular2 Filter issue

Question

here's how I am using the filter:

  <ion-item *ngFor="let contact of contacts | isMember">
           <ion-label>{{contact.name}}</ion-label>

           {{contact.phoneNumber}}-{{contact.isMember}}
       </ion-item>

Filter definition below:

import { Pipe, PipeTransform } from '@angular/core';
@Pipe({name: 'isMember'})
export class IsMemberPipe implements PipeTransform {
    transform(value: any): any {

        if (value.isMember === true) {
            return value;
        }
        return undefined;

    }
}

Goal is to only display rows that have isMember flag set to true.

TypeError: Cannot read property 'isMember' of undefined

Here's a plnkr:

http://plnkr.co/edit/fLdNAoMGLU8vkGOFmrV8?p=preview

Answer 1

Just ensure your pipe doesn't explode when null is passed in as value. Also return all values at once. The pipe doesn't get called with each value but with all contacts at once:

@Pipe({name: 'isMember'})
export class IsMemberPipe implements PipeTransform {
    transform(value: any, crit:boolean): any {
      console.log('x');
        console.log('log', value, crit);
        if (value) {
          return value.filter(v => v.isMember === crit) {
        } 

        return [];
    }
}