Angular2-Filter verschachtelte Array von Objekten

Question

Ich habe eine Reihe von Objekten wie folgt. Ich versuche, Search-Funktionalität zu erreichen, die Methode .filter() in meiner angular2-Anwendung verwendend.

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

Ich bin in der Lage Eltern/eine Ebene Filterung Code unten zu erreichen mit:

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

Das das Objekt zurückgibt, den Wert der Markierung übereinstimmt. Ich möchte auch 'fname' und 'lname' filtern.

Answer 1

Ihre Datenstruktur ist nicht gut geeignet, um eine beliebige String-Suche aus einer 3-Level-Datenstruktur wie dieser durchzuführen.

Sie werden am Ende alle drei Ebenen durchlaufen müssen - das Array von Objekten, das Ergebnis-Array in jedem Objekt und alle Eigenschaften der Objekte im Ergebnis-Array.

Dies ist eine O (n^3) -Operation und würde wahrscheinlich mit einem großen Datensatz nicht zufriedenstellend funktionieren. Möglicherweise müssen Sie darüber nachdenken, wie Sie diese Daten für diesen Anwendungsfall besser strukturieren können.

Answer 2

Ich würde, wenn ich die Daten vom Server bekomme eine Lookup-Variable in jedem Element erstellen, die den gesamten Text enthält, den Sie suchen möchten.

Aber stellen Sie sicher, dass dies nur einmal gemacht wird, da es nicht sehr performant wäre, wenn Sie es für jeden Tastendruck tun würden.

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

Dann können Sie mit der Methode

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

zu filtern enthält