目前，我对表格有一个性别和影响过滤器，它能够过滤所选选项的数据。
例如，如果您选择男性，它将过滤男性数据，对于女性，影响：适用和不适用。
现在，我想添加一个应用按钮，将它们连接在一起并进行过滤。单击应用按钮后，将过滤两者的数据组合。
任何人都可以帮我解决这个要求吗？
代码：
<div class="filter-data clearfix">
<form #form="ngForm">
<div class="form-group float-left mr-4">
<strong>Gender</strong>
<br>
<select class="form-control form-control-sm" name="gender" ngModel>
<option></option>
<option value="Male">Male</option>
<option value="Female">Female</option>
</select>
</div>
<div class="form-group float-left">
<strong>Impact</strong>
<br>
<select class="form-control form-control-sm" name="impact" ngModel>
<option></option>
<option value="Applicable">Applicable</option>
<option value="Not Applicable">Not Applicable</option>
</select>
</div>
<div class="form-group float-left mt-4 ml-2">
<button type="button" class="btn btn-primary btn-sm mr-2">Apply</button>
<button type="button" class="btn btn-secondary btn-sm">Reset</button>
</div>
</form>
</div>
<table class="table table-sm table-responsive">
<thead>
<tr>
<th>
<input type="checkbox" name="allNonTrades" (change)="selectAllClicked($event)">
</th>
<th>First Name</th>
<th>Last Name</th>
<th>Email</th>
<th>Gender</th>
<th>DOB</th>
<th>Impact</th>
<th></th>
</tr>
</thead>
<tbody>
<tr class="record-row" (click)="viewUser(user)" *ngFor="let user of allUser | tableFilter: form.value | paginate: { id: 'listing_pagination', itemsPerPage: 10, currentPage: page, totalItems: totalRecords }">
<td><input *ngIf="!isEdit" name="nontrades" [checked]="user.selected" (change)="changeTradesByCategory($event)" [(ngModel)]="user.checked" type="checkbox" (change)="checkboxClicked()"></td>
<td>{{user.first_name}}</td>
<td>{{user.last_name}}</td>
<td>{{user.email}}</td>
<td>{{user.gender}}</td>
<td>{{user.dob}}</td>
<td>{{user.impact}}</td>
<td>
<button *ngIf="!isEdit" class="btn btn-primary btn-sm" (click)="editUser(user)">Edit</button>
<button class="btn btn-primary btn-sm btn-sm ml-2" (click)="deleteUser(user)">Delete</button>
</td>
</tr>
</tbody>
</table>
表过滤器.pipe.ts
import { Pipe, PipeTransform } from '@angular/core';
@Pipe({
name: 'tableFilter'
})
export class TableFilterPipe implements PipeTransform {
transform(list: any[], filters: Object) {
const keys = Object.keys(filters).filter(key => filters[key]);
const filterUser = user => keys.every(key => user[key] === filters[key]);
return keys.length ? list.filter(filterUser) : list;
}
}