Grouping of async data binding

[Alex]

I'm trying to apply Grouping (https://www.telerik.com/kendo-angular-ui/components/dropdowns/multiselect/grouping/) to a multiselect where the data is bound using the async pipe. (https://www.telerik.com/kendo-angular-ui/components/dropdowns/multiselect/data-binding/#toc-async-pipe).

I'm getting a bit stuck, is what I'm trying to do possible? any chance of modifying the example for the async pipe to group the data?

[Dimiter Topalov]

Hi Alex,

To achieve the desired behavior, you will need to ensure that the Observable the MultiSelect will be bound to will yield the grouped data as a result when automatically subscribed to via the async pipe.

This can be done by either grouping the data on the server, or processing the response on the client after received and before subscribed to, for example via the RxJS "map" operator in the Observable pipeline (pipe()), e.g.:

https://stackblitz.com/edit/angular-6kvfey?file=app/categories.service.ts

I hope this helps.

Regards,
Dimiter Topalov
Progress Telerik

[Alex]

Having struggled with this for several hours I eventually realised that this functionality was added in 3.5.0 and we're on 3.4.2 at the moment!