Angular2フィルタネストされたオブジェクトの配列

Question

私は以下のようなオブジェクトの配列を持っています。私は、角度2のアプリケーションで.filter（）メソッドを使用して検索機能を実現しようとしています。

[{ 
"label": "new", 
"result": [{ 
    "label": "new", 
    "fname": "abc", 
    "lname": "xyz" 
}, { 
    "label": "new", 
    "fname": "abc1", 
    "lname": "xyz1" 
}]}, 
{ 
    "label": "old", 
    "result": [{ 
     "label": "old", 
     "fname": "abc2", 
     "lname": "xyz2" 
    }] 
}] 

私は、コードの下に使用して親/ 1レベルのフィルタリングを達成することができる午前：

this.data.filter(item => (item.label.toLowerCase().indexOf(inputText) !== -1); 

これは、ラベルの値に一致するオブジェクトを返しています。私は 'fname'と 'lname'にもフィルタをかけたいと思っています。

Answer 1

データ構造は、このような3レベルのデータ構造から任意の文字列検索を行うのには適していません。

あなたは、オブジェクトの配列、各オブジェクトの結果配列、結果配列のオブジェクトのすべてのプロパティの3つのレベルをすべて反復する必要があります。

これはO（n^3）操作であり、大きなデータセットでは不十分に機能する可能性があります。このユースケースでこのデータをより良く構成する方法について考える必要があるかもしれません。

Answer 2

サーバーからのデータを取得すると、検索可能にするすべてのテキストを含むすべての項目内に検索変数が作成されます。

ただし、これはすべてのキーストロークでそれを実行した場合、それほど効果的ではないため、一度だけ実行してください。

// Add searchable string to users 
    users.forEach(u => { 
    u.filterTerm = `${(u.id || '').toLowerCase()} ${(u.email || '').toLowerCase()} ${(u.firstName || '').toLowerCase()} ${(u.lastName || '').toLowerCase()}`; 
}); 

次にあなたが

let filtered = allUsers.filter(u => { 
    return u.filterTerm.includes(filterTerm); 
}); 

をフィルタリングすることを含む方法を使用することができます