angulartypescriptangular2-pipe

angular 2 - filter pipe return empty

I am trying use filter pipe to filter my data but it returns an empty page. If I remove the | filter on html, there will be data shown. filter pipe works like if the name exist, it will display all the names.

First time using filter pipe, please point out any mistake I make.

Data Example

[

    {
        "name": "Alien",
        "age": 18,
        "address": "lorem ipsum"

    },
    {
        "name": "Peter",
        "age": 17, 
       "address": "lorem ipsum"
    }
    {
        "name": "Ben",
        "age": 20, 
        "address": "lorem ipsum"
    }

]

html

  <ion-item *ngFor="let list of this.data | filter: 'name'">

  <h2>{{ list.name }}</h2>

  </ion-item>

filter pipe

export class MyPipe implements PipeTransform {

transform(listArray: any, value: any): any {

if ( value === undefined )return listArray;

  for( let i= 0; i<listArray; i++){

 if (listArray.indexOf("value")){
 return value;
      }
   }

  }

}
Solution

  • If you write

    listArray.indexOf("value")

    it will return the items that contains the string "value" inside that array.

    I think what you meant to do is

    listArray.indexOf(value)