angular 2+，mat table-过滤不适用于模型中的模型

Question

我有一个带有数据源的垫子表，模型如下：

.ts

interface DataModel {
id: number;
projectName: string;
material: material;
}
interface material {
materialID: number;
materialName: string;
}

.html

<mat-form-field>
<mat-label>Filter</mat-label>
<input matInput (keyup)="applyFilter($event)" placeholder="" #input>
</mat-form-field>
<div class="mat-elevation-z8">
<table mat-table [dataSource]="dataSource" matSort>

<ng-container matColumnDef="projectName">
<th mat-header-cell *matHeaderCellDef mat-sort-header> projectName</th>
<td mat-cell *matCellDef="let row"> {{row.projectName}} </td>
</ng-container>
<ng-container matColumnDef="material">
<th mat-header-cell *matHeaderCellDef mat-sort-header> material </th>
<td mat-cell *matCellDef="let row"> {{row.material ? row.material.materialName  : ''  }} </td>
</ng-container>
<tr mat-header-row *matHeaderRowDef="displayedColumns"></tr>
<tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr>

<tr class="mat-row" *matNoDataRow>
<td class="mat-cell" colspan="4">No data matching the filter "{{input.value}}"</td>
</tr>
</table>

1. 从垫表过滤不适用于材料单元格
2. tr的最后一行不起作用，如果没有匹配项，它应该显示消息

感谢您的帮助。

编辑。：角度版本：8.0示例：https://stackblitz.com/edit/angular-cxmmdz?file=src/app/table-filtering-example.ts-筛选对｛｛row.color.name｝｝无效

Answer 1

好的，我找到了简单的解决方案。

export interface UserData {
id: number;
name: string;
color: string;
}
export interface ColorName {
id: number;
name: string;
}
const ELEMENT_DATA_COLOR: ColorName[] = [
{id: 1, name: 'red'},
{id: 2, name: 'orange'}
];
const ELEMENT_DATA: UserData[] = [
{id: 1, name: 'one',color:ELEMENT_DATA_COLOR[0].name },
{id: 2, name: 'two',color: ELEMENT_DATA_COLOR[1].name}
];

但我有一个问题。我从.net核心API获取数据。它看起来像：

const ELEMENT_DATA: UserData[] = [
{id: 1, name: 'one',color:ELEMENT_DATA_COLOR[0] },
{id: 2, name: 'two',color: ELEMENT_DATA_COLOR[1]}
];

因此，如果我想过滤工作，我需要将数据保存到另一个模型中，其中颜色是字符串而不是对象颜色，因为过滤不适用于｛｛row.color.name｝｝(用于例如AutoMapper(？