0

使用以下示例使用自定义过滤器时,我清楚地收到此错误消息: https ://vmware.github.io/clarity/documentation/v0.11/datagrid/custom-filtering

错误类型错误:无法读取未定义的属性“订阅”错误出现在第一行:

   <clr-dg-column *ngFor="let column of (gridData$ | async)?.columnDefs" [clrDgField]="'column.name'">
       {{ column.name }}
       <clr-dg-filter [clrDgFilter]="datagridFilter">
           <app-datagrid-filter #datagridFilter></app-datagrid-filter>
       </clr-dg-filter>
   </clr-dg-column>

如果我删除#datagridFilter,错误就会消失,但过滤器输入不会显示。

DatagridFilter 定义为:

import { Component, OnInit, ChangeDetectionStrategy, Input } from '@angular/core';

import {Filter} from "clarity-angular/data/datagrid/interfaces/filter";
import {Subject} from "rxjs/Subject";


@Component({
    selector: "app-datagrid-filter"
})
export class DatagridFilter implements Filter<any> {
    changes = new Subject<any>();
    constructor(public prop: any) {
        this.prop = prop;
    }
    isActive(): boolean {
        return true;
     }
    accepts(item: any):boolean {
        return true;
        //return item.indexOf(search) > -1 || item.filter(i => i.indexOf(search) > -1)[0]
    }
}

DatagridFilter 在父组件中进一步实例化。片段:

export class DatagridComponent implements OnInit {
  count: number = 10;
  gridData$: Observable<any>;
  reportAction$: Observable<any>;
  formDefinition$: any;
  totalRecords$: Observable<number>;
  selected: any = [];
  datagridFilter: any;

......
ngOnInit() {

......
    this.gridData$.subscribe(data => {
        this.datagridFilter = new DatagridFilter(data.columnDefs);
    });
...
4

0 回答 0