角材料6 MatTable无法正常工作

Question

我有一个表，该表使用RXJS（存储，reducer等）从SQL数据库中提取数据，并将数据放入“智能”容器中，最终将数据扔到我的“哑巴”组件中。位于。

表中的数据加载就很好了。但是当我键入过滤器时，它什么也没做，并且表保留了与以前相同的数据。

我尝试使用单独的dataSource-dataSource = new MatTableDataSource<AdminData>();并在我的ngOnInit()中对其进行了初始化-过滤器可以正常工作，但是表中没有任何数据。因此，似乎我要么需要选择在@Input()上直接实现MatTableDataSource而不选择过滤器，要么使用单独的dataSource。任何帮助表示赞赏。

TS：

import { Component, OnInit, Input } from '@angular/core';
import { MatTableDataSource } from '@angular/material';
import { AdminData } from '../../models/admin.model';

@Component({
  selector: 'app-admin',
  templateUrl: './admin.component.html',
  styleUrls: ['./admin.component.css']
})
export class AdminComponent implements OnInit {

  @Input() adminLoading: boolean;
  @Input() adminData: MatTableDataSource<AdminData[]>;

  displayedColumns = ['fullName', 'loginName', 'defaultPlant'];

  constructor() { }

  ngOnInit() { }

  applyFilter(filterValue: string) {
    this.adminData.filter = filterValue.trim().toLowerCase();
  }

}

HTML：

<div class="container">
  <mat-form-field id="table-filter" *ngIf="!adminLoading">
    <input matInput (keyup)="applyFilter($event.target.value)" placeholder="Filter">
  </mat-form-field>

  <div class="table-container" *ngIf="!adminLoading">
    <table mat-table [dataSource]="adminData">

      <ng-container matColumnDef="fullName">
        <th mat-header-cell *matHeaderCellDef> Full Name </th>
        <td mat-cell *matCellDef="let element"> {{element.displayUserName}} </td>
      </ng-container>

      <ng-container matColumnDef="loginName">
        <th mat-header-cell *matHeaderCellDef> Login Name </th>
        <td mat-cell *matCellDef="let element"> {{element.loginName}} </td>
      </ng-container>

      <ng-container matColumnDef="defaultPlant">
        <th mat-header-cell *matHeaderCellDef> Default Plant </th>
        <td mat-cell *matCellDef="let element"> {{element.defaultPlant}} </td>
      </ng-container>

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

版本：

Angular            6.0.3
@angular/cdk       6.2.0
@angular/cli       6.0.7
@angular/material  6.2.0
rxjs               6.2.0