【问题标题】:Issues in custom filtering boolean value in primeng Tableprimeng 表中自定义过滤布尔值的问题
【发布时间】:2018-11-13 18:06:37
【问题描述】:

我正在使用 primeng 表在我的 Angular 应用程序中显示数据, 我现在遇到的问题是我必须使用过滤器,但有条件,例如如果用户类型为 0、1 或 2,我必须基于此显示数据,我正在尝试的是这个

        if(value == 0) {
            table.filter(value, fieldName, 'equals');
        } else if(value == 1) {
            table.filter(0, fieldName, 'gt');
            table.filter(false, 'array[0].fieldName',  'equals');
        } else if(value == 2) {
            table.filter(0, fieldName, 'gt');
            table.filter(true, 'array[0].fieldName',  'equals');
        }

如果用户输入 0,它的过滤很好,但问题是当他输入 1 或 2 时,因为我必须从 2 个字段中过滤,我不确定我在primeng 中尝试做的事情是否可行。

【问题讨论】:

    标签: angular typescript primeng primeng-datatable


    【解决方案1】:

    table.filter(...) 在单个列上工作。

    它旨在过滤特定列上的数据。以下是filter函数的类型定义:

    filter(value: any, field: any, matchMode: any): void;
    

    但是您走在正确的道路上,因为可以设置不同的过滤器,每列一个,然后与 AND 组合以过滤表中的数据。

    例如以下函数可以使用多列进行过滤:

    filter(dt) {
      dt.filter('Blue', 'color', 'equals');
      dt.filter('Bmw', 'brand', 'equals');
    }
    

    这是一个模板示例:

    <p-table #dt [value]="cars">
      <ng-template pTemplate="header">
         <tr>
          <th>
            Color
          </th>
          <th>
            Brand
          </th>
         </tr>
       </ng-template>
       <ng-template pTemplate="body" let-car>
         <tr>
          <td>{{car.color}}</td>
          <td>{{car.brand}}</td>
         </tr>
       </ng-template>
    </p-table>
    
    <button (click)="filter(dt)">Get Blue Bmw</button>
    

    还有一个完整的组件:

    export class MyComponent {
      cars: {
        color: string;
        brand: string;
      }[];
    
      constructor() {
        this.cars = [{
          color: "blue",
          brand: "bmw"
        },{
          color: "red",
          brand: "bmw"
        }];
      }
    
      filter(dt) {
        dt.filter('Blue', 'color', 'equals');
        dt.filter('Bmw', 'brand', 'equals');
      }
    }
    

    该按钮将对多列应用过滤器,这将产生数据 被color equals BlueANDbrand equals Bmw过滤。

    编辑:它对boolean 的作用相同。

    cars: {
      color: string;
      brand: string;
      enable: boolean;
    }[];
    
    filter(dt) {
      dt.filter('Blue', 'color', 'equals');
      dt.filter('Bmw', 'brand', 'equals');
      dt.filter(true, 'enable', 'equals');
    }
    

    在您粘贴的代码中 'array[0].fieldName' 由于引号被视为文字,因此它会查找字段名称“array[0].fieldName”并且不对其进行评估。

    【讨论】:

    • 感谢您的回答,我使用的是表格而不是 p-table,看起来问题是布尔值,因为我在文本字段上尝试相同的代码,它适用于 2 列
    • 我们的代码是一样的,你能确认一下布尔值的代码吗,我在布尔字段上应用这个
    • 我如何计算布尔值?
    • @MuhammadArslan 我已更新答案以回答您的问题。
    • 感谢您的回答,那么我如何添加我的字段,因为它在另一个数组中?
    猜你喜欢
    • 2017-10-05
    • 2019-01-26
    • 1970-01-01
    • 2018-01-31
    • 2017-11-03
    • 2021-02-24
    • 1970-01-01
    • 2021-08-18
    • 2020-09-11
    相关资源
    最近更新 更多