How to create one function to insert a word when I click on it in Angular .kendo context menu

Question

I'm having trouble figuring out how I'm going to be able to insert a word when click on it from the context menu, my code is this : public items: component.ts

<html>
<a> any[] = [
      {
        text: "hello",
        items: [{ text: "Item1.1" }, { text: "Item1.2" }],
      },
      {
        text: "Item2",
        
      },
      {
        text: "hello2",
      }] </a></html>

and my context menu :

I wanted, for example, to press hello2 and it would write where I clicked with the mouse.

score 1 · Answer 1 · answered Sep 21 '21 at 21:36

1

When you define your items in the component's typescript file, assign the data property to the value you wish to insert. Then declare a function that gets the item:

items: any[] = [
  {
    text: 'hello',
    items: [
      {
        data: 'Item1.1',
        text: "Item1.1"
      },
      {
        data: 'Item1.2',
        text: "Item1.2"
      }
    ],
    // etc...
];

function menuSelect(e: any): void {
  const data = e.item?.data;
  console.log(data); // do something with data
}

Then when you define your kendo-menu, bind the items property (documentation) to respective variable and the menuSelectEvent (documentation) to the respective function:

<kendo-menu [items]="items" (select)="menuSelect($event)">
</kendo-menu>

answered Sep 21 '21 at 21:36

David

5,877
3
23
40

thanks for the clarification. Do you know any way now with this word to insert in the text editor I have? – Claudio Guedes Sep 22 '21 at 09:24
@ClaudioGuedes - What text editor component are you using? – David Sep 22 '21 at 13:11
https://codemirror.net/ in angular – Claudio Guedes Sep 22 '21 at 14:33
1

@ClaudioGuedes - I'm not familiar with that component. Looking at the API documentation, I would suggestion calling the getCursor method to get the character index of where the right-click was pressed: https://codemirror.net/doc/manual.html#getCursor combined with getValue and setValue to set the text. – David Sep 22 '21 at 18:33
ok I will try, thanks for the help – Claudio Guedes Sep 23 '21 at 08:44

How to create one function to insert a word when I click on it in Angular .kendo context menu

1 Answers1