角度过滤使用垫选择过滤器使垫表的行完全相等

时间:2020-08-17 08:44:09

标签: angular

我正在使用mat-select来过滤mat表的行,但是我的选项是相关的,即一个选项完全包含第二个字符串。

代码:-

<div class="result-header">
                <div class="row">
                    <mat-form-field class="col-md-6">
                        <input matInput (keyup)="filter($event.target.value)" placeholder="Filter">
                        <mat-select [(value)]="selected" (selectionChange)="filter($event.value)">
                            <mat-option value="">All</mat-option>
                            <mat-option value="SP">SP</mat-option>
                            <mat-option value="REVERSE_SP">REVERSE_SP</mat-option>
                        </mat-select>
                    </mat-form-field>
                    <mat-paginator class="col-md-6" [pageSize]="10" [pageSizeOptions]="[5, 10, 20]"
                        showFirstLastButtons></mat-paginator>
                </div>
            </div>

<div class="result-table">
                <mat-table #table [dataSource]="dataSource" matSort>
                    <ng-container matColumnDef="id">
                        <mat-header-cell *matHeaderCellDef mat-sort-header> Id </mat-header-cell>
                        <mat-cell *matCellDef="let result"> {{result.id}} </mat-cell>
                    </ng-container>
                    <ng-container matColumnDef="name">
                        <mat-header-cell *matHeaderCellDef mat-sort-header> Name </mat-header-cell>
                        <mat-cell *matCellDef="let result"> {{result.name}} </mat-cell>
                    </ng-container>
 </mat-table>

现在,当我选择sp时,默认情况下,reverse_sp也会出现,因为过滤器是这样写的:-

.ts文件:-

selected = '';
public filter(filterValue: string): void {
    filterValue = filterValue.trim();
    filterValue = filterValue.toLowerCase();
    this.dataSource.filter = filterValue;
}

我应该如何修改它以仅获取确切的值。另外,应该怎么做才能获取所有记录? 我必须使用3个选项:-所有行,sp和reverse_sp。

0 个答案:

没有答案