filtre personnalisé dans le tapis de table

Je suis en utilisant tapis de table. Il dispose d'un filtre qui fonctionne très bien avec le doc exemple:

De https://material.angular.io/components/table/overview, le code d'origine est:

    <div class="example-header">
       <mat-form-field>
         <input matInput (keyup)="applyFilter($event.target.value)" placeholder="Filter">
       </mat-form-field>
   </div>

   <mat-table #table [dataSource]="dataSource">
      <!-- the rest of the code -->
   </mat-table>
    export class TableFilteringExample {
     displayedColumns = ['position', 'name', 'weight', 'symbol'];
     dataSource = new MatTableDataSource(ELEMENT_DATA);

     applyFilter(filterValue: string) {
       filterValue = filterValue.trim(); //Remove whitespace
       filterValue = filterValue.toLowerCase(); //MatTableDataSource defaults to lowercase matches
       this.dataSource.filter = filterValue;
     }
    }
    const ELEMENT_DATA: Element[] = [
     {position: 1, name: 'Hydrogen', weight: 1.0079, symbol: 'H'},
     {position: 2, name: 'Helium', weight: 4.0026, symbol: 'He'},
     {position: 3, name: 'Lithium', weight: 6.941, symbol: 'Li'},
     {position: 4, name: 'Beryllium', weight: 9.0122, symbol: 'Be'},
     {position: 5, name: 'Boron', weight: 10.811, symbol: 'B'}
    ]; 

Avec cette mise en œuvre, lorsque le filtre, le filtre pour n'importe quelle colonne.

Maintenant, je vais essayer de changer le filtre parce que je veux c'est de filtrer juste pour la colonne "nom", donc je suis en train de réécrire le filtre et d'attribuer à la filterData.

      applyFilter(filterValue: string) {
        filterValue = filterValue.trim(); //Remove whitespace
        filterValue = filterValue.toLowerCase(); //MatTableDataSource defaults to lowercase matches
       this.dataSource.filteredData = this.filterByEmail(filterValue); 
        console.log(this.dataSource.filteredData); //value is what I want.
    }

    filterByName(filter: string): any {
      const dataFiltered = this.data.filter(function(item){
         return item.name.indexOf(filter) > -1
       })
        return dataFiltered;
    }

Dans la console, je peux voir que cela.source de données.filteredData a des données que je veux imprimer, mais le tableau n'est pas de rechargement.

Ce sont je suis absent?

InformationsquelleAutor cucuru | 2018-01-29