Hello,
I have the following setup where data is bound to a DropDownList using async pipe.
Here is my service:
public get(state: any): void {
this.getListData(state).subscribe(x => super.next(x));
}
getListData(state: DataStateChangeEventArgs): Observable {
const options = this.getOptions(state);
return this.search(options);
}
private search(options): Observable<{}> {
return this.service.search(options)
.pipe(map((response: any) => {
return response['content'];
}),
catchError((err, caught) => {
console.error(err);
return of([]);
}));
}
Here is my component:
public data: Observable;
public fields: Object = { value: 'id', text: 'title' };
public state: DataStateChangeEventArgs;
constructor(public service: MyService) {
this.data = service;
}
ngOnInit(): void {
this.state = { skip: 0, take: AppConfig.gridDefaults.pageSize };
this.service.get(this.state);
}
Here is the html template:
<ejs-dropdownlist [dataSource]='data | async' [fields]='fields' [allowFiltering]="true" (filtering)="onFiltering($event)"></ejs-dropdownlist>
The data binding works well and the DropDownList gets populated with data.
What code is needed to filter the data? Filtering should take place server-side. Should I pass a predicate to the state property and call this.service.get again?
Can you provide a sample?
Thank you in advance,
