0

我正在尝试过滤存储在下拉列表中的数据。过滤器框应该在下拉选项之外，所以我需要创建一个自定义过滤功能。我获取输入字符串（例如“Jan”）并尝试找到匹配的数值（在本例中：“Jan” = 1）。然后我查看数据，看看是否有任何月份与该数值匹配。当我打印出返回的数据时，似乎我得到了正确的输出。但是，当我尝试更新表使用的数据时，它不会改变。

**HTML:**
<p-table #tt [value]="data" (onFilter)="filter($event)"....>

<input pInputText type="text" class="colmsearch"
placeholder="Search" 
(input)="tt.filter($event.target.value, 'month', 'contains')">

.
.
.
<p-dropdown formControlName="month" class="dropdownInput" *ngSwitchCase="'month'"
[options]="monthLabels"></p-dropdown>

</p-table>

**TS:**
this.data = [
    {id: 03, name: 'First', month: 1},
    {id: 04, name: 'Second', month: 2},
    {id: 05, name: 'Third', month: 1},
    .
    .
    {id: 07, name: 'Fourth', month: 3}

];

this.monthLabels = [
    {label: "Jan", value: 1},
    {label: "Feb", value: 2},
    {label: "Mar", value: 3},
    .
    .
    {label: "Dec", value: 12}
];

newValues: any[];

public filter(event){
        if (event.filters.month) {
            this.newValues = this.filterHelper(event.filters.month.value);
            this.data = this.newValues;
        }
        else {

            this.data = this.origData; //origData: a value that stores the unaltered original data
        }
}

    public filterHelper(filterV) {
        //Step 1: Find the number values that are associated with
        this.newMonths = []

        for (let i = 0; i < 12; i++) {
            if (this.monthLabels[i].label.toLowerCase().includes(filterV)) {
                this.newMonths.push(this.monthLabels[i].value);

            }
        }

        //Step 2: Find the associated data with that value
        this.newData = [];

        for (let i = 0; i < this.data.length; i++) {
            for (let j = 0; j < this.newMonths.length; j++) {
                if (this.data[i].month == this.newMonths[j]) {
                    this.newData.push(this.data[i]);
                }
            }
        }

        return this.newData;
    }
4

1 回答 1

2

没有填充正确的数据，因为即使在过滤后您也使用相同的对象，并且 PrimNg Turbo 表使用onPush更改检测策略。尝试修改下面的代码

 this.data = [...this.newValues]; // in filter method

或者

this.newData.push(Object.assign(this.data[i])); // during filtering

它应该工作。

于 2019-11-05T12:12:51.120 回答