Kendo ui for angular: bind click event of kendoButton to a method of a variable in the component

Question

I have a component-variable "message" of type "any" that holds a method "actionnowrapper()"

Whenever I bind to a button like below, this works well.

<button (click)="message.actionnowrapper()"></button>

Whenever I use the kendoButton directive, this no longer works.

<button kendoButton (click)="message.actionnowrapper()"></button>

Binding the Kendobutton directly to a method in the component does the trick, but this is not what we need.

 <button (click)="actionnowrapper()"></button>

How can I bind a kendobutton to a method in a component-variable?

Thx!

Answer 1

The regular button and Kendo button click handlers work in the same way:

<button kendoButton (click)="message.actionnowrapper('kendo')">Click</button>
<button (click)="message.actionnowrapper('regular')">Click</button>

export class AppComponent {
message = {
  actionnowrapper: (buttonType: string) => {
      alert(`${buttonType} button clicked`)
    } 
  }
}

EXAMPLE