Add Split-Button Items programmatically

I use a split button with some hardcoded added key/value pairs. It works fine.
But I would like to add items programmatically (I have an array of key/value pairs).
I tried to replace the items in the object by myself, but then they are missing their commands, so there is no click-action if I do it that way.

this.splitbuttonAddFeature.items = ${result}.map(i => {
return { label: i, id: i }
})

How would I do that?

Here is what the internal code does:

    this.items = this.children.map(option => {
      return {
        label: option.text,
        id: option.value != null ? option.value : option.text,
        icon: option.icon,
        command: () => {
          setTimeout(() => this.click.next(option));
        }
      };
    });

It assigns a command handler. You can try something like this:

this.splitbuttonAddFeature.items = ${result}.map(i => {
   return { 
      label: i, 
      id: i, 
      command:() => {
         this.splitbuttonAddFeature.next({label:i, id:i});
      } 
   };
})
1 Like