angular / angular/components

Relax MatTableDataSource’s filter to be of type “{}”

Ouverte
#16,112 8 commentaires 6 réactions 0 personnes assignées Voir sur GitHub
area: material/table feature P3
Langage dominant
TypeScript
Étoiles
25k
Forks
6.8k
Merge moyen
1 j 8 h
PR mergées (30 j)
91

Description

#### Feature Description
Relax `MatTableDataSource.filter` to accept `{}`. Right now, it is restricted to `string`.
This would allow *much* easier custom filtering on multiple dimensions.

#### Use Case
When the filter is “only” a string, it makes it very difficult to “structurally” filter a table on multiple dimensions, even when customizing `filterPredicate` . Some recommendations on internet include:
- passing a JSon object, and parsing the JSon `filterPredicate`, for each and every row: http://nataliesmith.ca/blog/angular-material-filter-table
- everything in this bug thread: https://github.com/angular/components/issues/6178

While it works, it’s also a gratuitous workaround: It turns out that at no point does `MatTableDataSource` actually *require* filter to be a `string`: Whatever gets passed to `filter` just gets piped “as-is” to `filterPredicate`.

Here is a simple fork of “Table with filtering” that filters on different columns individually, where all I did was pass my complex object, while not respecting :
https://stackblitz.com/edit/table-filtering-multiple-filters-example?file=app/table-filtering-example.html
https://table-filtering-multiple-filters-example.stackblitz.io/

#### Caveats

It would still be up to the caller to make sure that their `filter` object is homogeneous with their `filterPredicate` object.

Guide de contribution

Ouvrir le guide de contribution

Piste de recherche

Commencez au point d’entrée MatTableDataSource.filter et examinez comment sa valeur est transmise à filterPredicate. Mettez à jour le type public afin qu’il accepte {}, tout en préservant le flux existant du prédicat, puis vérifiez que les objets de filtre structurés multidimensionnels fonctionnent sans nécessiter de conversion JSON.

Rédigé par le modèle d'indexation à partir du texte de l'issue.

Évaluation

Stack technique
angular, typescript
Domaine
frontend
Type d'issue
Fonctionnalité
Difficulté
2/5
Temps estimé
1-3 heures
Activité
À l'abandon
Clarté
Clairement spécifiée
Accessibilité débutants
45/100

Recevez les nouvelles issues par e-mail

Un résumé court des issues GitHub adaptées aux débutants.