Сортировка матов не работает после изменения источника данных - PullRequest
Новая
       86

Сортировка матов не работает после изменения источника данных

0 голосов
/ 01 ноября 2019

Сортировка матов не работает после изменения источника данных. От родителя после добавления нового сотрудника в массив сотрудников я отправляю новую копию массива дочернему элементу. Я мог видеть новые строки в таблице дочерних матов, нумерация страниц работает нормально, но сортировка не работает должным образом

parent: 

<app-employeeList-list [EmployeeList]='EmployeeList' ></app-employeeList-list>

child: 

displayedColumns: string[] = ["hireDt", "jobTitle"];

  dataSource: MatTableDataSource<IEmployee>;


  @Input() EmployeeList: IEmployee[];

  @ViewChild(MatPaginator, { static: true }) paginator: MatPaginator;

  @ViewChild(MatSort, { static: true }) sort: MatSort;

   ngOnChanges() {

   // console.log(this.EmployeeList) ---showing all employees including newly 
                                       added employee 

    this.dataSource = new MatTableDataSource(this.EmployeeList);
    this.dataSource.paginator = this.paginator;
    this.dataSource.sort = this.sort;

  }

child html: 

<div class="mat-elevation-z4">
    <table mat-table [dataSource]="dataSource" matSort>

      <!-- hireDt Column -->
      <ng-container matColumnDef="hireDt">
        <th mat-header-cell *matHeaderCellDef mat-sort-header> Hire Date </th>
        <td mat-cell *matCellDef="let row"> {{row.hireDt | date}} </td>
      </ng-container>

      <!-- jobTitle Column -->
      <ng-container matColumnDef="jobTitle">
        <th mat-header-cell *matHeaderCellDef mat-sort-header> Job Title </th>
        <td mat-cell *matCellDef="let row"> {{row.jobTitle}} </td>
      </ng-container>

      <tr mat-header-row *matHeaderRowDef="displayedColumns"></tr>
      <tr mat-row *matRowDef="let row; columns: displayedColumns;">
      </tr>
    </table>

    <mat-paginator showFirstLastButtons [pageSizeOptions]="[5,10,15,20]"></mat-paginator>
  </div>
...