清晰度Datagrid默认字符串过滤器问题

时间:2018-10-06 07:16:22

标签: angular vmware-clarity

更新:已解决。。您需要使用* clrDgItems而不是* ngFor来迭代和布局行。

继续进行角度和清晰度的自我教育,我陷入了上述问题。

一开始:角度版本:6清晰度版本:0.13.4

我正在尝试“基本过滤”示例(如示例中所示),但它似乎对我不起作用。

a。定义了一个实现clrDatagridStringFilterInterface的类 b。

中使用的定义

尽管用于过滤器的ui出现了……它似乎并没有触发类中的'accept'方法。

以下是摘要

1。 user.ts

export class User {
  id: any;
  name: any;
  age: any;
  rem: any;

}

2。 NameFilter

class NameFilter implements ClrDatagridStringFilterInterface<User> {
    accepts(user: User, search: string):boolean {
      console.log(user);
        return "" + user.name == search
            || user.name.toLowerCase().indexOf(search) >= 0;
    }
}

**似乎这个过滤器甚至没有被激活,因为我没有     console.log(用户)...

3。 TestComponent.ts

export class TestComponent implements OnInit {
  nameFilter = new NameFilter();
  ....
}

4.component html代码段

<clr-dg-column>Id</clr-dg-column>
            <clr-dg-column clrDgField="name">Name
              <clr-dg-string-filter [clrDgStringFilter]="nameFilter"></clr-dg-string-filter>
            </clr-dg-column>
            <clr-dg-column>Age</clr-dg-column>
            <clr-dg-column>Rem</clr-dg-column>

            <clr-dg-row *ngFor="let rec of data" [clrDgItem]="rec">


                <clr-dg-cell>{{rec.id}}</clr-dg-cell>
                <clr-dg-cell>{{rec.name}}</clr-dg-cell>
                <clr-dg-cell>{{rec.age}}</clr-dg-cell>
                <clr-dg-cell>{{rec.rem}}</clr-dg-cell>


            </clr-dg-row>

我在做什么错了?我在Stackblitz上看到的一些示例..仅在列定义上使用了“ clrDgField”,它就可以工作了……Havent看到了etc的任何定义……但是,他们似乎使用的是Clarity v0.11。

谢谢。

更新:已解决。。您需要使用* clrDgItems而不是* ngFor来迭代和布局行。

0 个答案:

没有答案