ValueNormalizer Returns - Add to List?

[Keith]

Good day!  Here is another question on the ComboBox allowing custom additions.

When the valueNormalizer function returns, is  there a simple way to have the new accepted value be automatically added to the the data list without requesting essentially a refresh?

[Keith]

I believe I have a good solution in place.  I'll provide a code sample soon.

[Martin Bechev]

Hello Keith,

In order to be added to the ComboBox list, custom values need to be pushed to the bound array collection. To ensure that the reference of the array is changed (in order to trigger the Angular change detection), the most straightforward approach is to utilize spread operator:

public valueNormalizer = (text: Observable<string>) =>
    text.pipe(
      map((content: string) => {
        const newValue = {
          value: this.listItems[this.listItems.length - 1].value + 1,
          text: content
        };
        this.listItems = [...this.listItems, newValue];
        return newValue;
      })
    );

Here is an example where the custom values are automatically added to the list:

https://stackblitz.com/edit/angular-n7aseu

Please write back in case any further assistance is required for this case.

Regards,
Martin
Progress Telerik