Not able to filer using custom floating filter in ag grid

Question

I have ag grid implemented in my angular2+ app, filters are working fine for me but for some fields i need custom filter because those fields are not direct fields in main array for example

abc = [
    xyz_field,
    inner_parent_array: [{inner_field: 60}]
]

i want to filter through field called inner_field but not able to do so using custom filters

this is the code from floatingfiltercomponent

private params: IFilterParams;
private valueGetter: (rowNode: RowNode) => any;
public text: string = '';

@ViewChild('input', {read: ViewContainerRef}) public input;

agInit(params: IFilterParams): void {
    this.params = params;
    this.valueGetter = params.valueGetter;
    console.log(this.params);
}

isFilterActive(): boolean {
    return this.text !== null && this.text !== undefined && this.text !== '';
}

doesFilterPass(params: IDoesFilterPassParams): boolean {
    console.log(params.node);
    return this.text.toLowerCase()
        .split(" ")
        .every((filterWord) => {
            return this.valueGetter(params.node).toString().toLowerCase().indexOf(filterWord) >= 0;
        });
}

getModel(): any {
    return {value: this.text};
}

setModel(model: any): void {
    this.text = model ? model.value : '';
}

ngAfterViewInit(params: IAfterGuiAttachedParams): void {
    setTimeout(() => {
        this.input.element.nativeElement.focus();
    })
}

onChange(newValue): void {
    if (this.text !== newValue) {
        this.text = newValue;
        console.log(this.params);
        this.params.filterChangedCallback();
    }
}

but it gives error, this.params.filterChangedCallback is not a function, i am not sure how i can fix this

filter working fine for xyz_field but not for inner_field

here is the live example of what i want to do

https://plnkr.co/edit/euuPnjpQ2IwtbKRYTXIv?p=preview

Answer 1

AG-Grid support help me to find this, use valueGetter insead of valueFormatter in columns definition