2017-07-31 6 views
1

私のデータをフィルタリングするためにフィルターパイプを使用しようとしていますが、空のページを返します。 htmlで| filterを削除すると、データが表示されます。フィルターパイプは、nameのように機能し、すべての名前を表示します。角度2 - フィルターパイプが空になる

フィルターパイプを初めて使用した場合、間違いを指摘してください。

データ例

[ 

    { 
     "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> 

フィルタパイプ

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; 
     } 
    } 

    } 

} 
+0

あなたのパイプのポストコフレコード – Sajeetharan

+0

ごめんなさい、これまで私が試したことです。ほとんどの場合、検索機能に関連付けられているので、オンラインで提供されている例を理解できません –

+0

console.log(値)を試してください。あなたのフィルタクラスでは、私は静的な文字列 "名前"を検索で送信していると確信しています –

答えて

1

あなたは

listArray.indexOf("value") 

を書く場合には、その配列内の文字列"value"が含まれている項目を返します。

私はあなたが何を意図する

listArray.indexOf(value) 
1

すべてのパイプの名を持つ必要があり、あなたが文字列である 'の代わり'valueの値を使用する必要があると思います。

@Pipe({ name: 'filter' }) 
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; 
    } 
} 
} 
}