Difficulty displaying context menu on tree grid

[Anthony]

  Hi,

I'm trying to follow the documentation to insert a context menu in a tree-grid.  From the documentation here,  app.component.ts imports ToolbarItems  and I can't see why it does, secondly, the documentation refers to injecting the contextMenu module into the tree-grid how it only refers to contextMenuItems in the HTML.  I've tried various combinations (also canabalising code from here) but I can't get the context menu, can you see where I'm going wrong? 

My tree-grid:

        <div class="content-section implementation">

            <ejs-treegrid [dataSource]='ds' [treeColumnIndex]='1' [sortSettings]="sortSettings" [allowSorting]="true"

                [contextMenuItems]='contextMenuItems' childMapping='children' [allowPaging]="true"

                [pageSettings]='pageSettings'>

                <e-columns>

                    <e-column field='id' headerText='Role ID' textAlign='Left' width=20></e-column>

                    <e-column field='title' headerText='Title' textAlign='Left' width=90></e-column>

                    <e-column field='name' headerText='Name' textAlign='Left' width=60></e-column>

                    <e-column field='department' headerText='Department' textAlign='Left' width=60></e-column>

                    <e-column field='smf' headerText='SMF' width='30'>

                        <ng-template #template let-ds>

                            <div>

                                <ejs-checkbox id='check{{ds.id}}' #checkbox [checked]=ds.smf disabled></ejs-checkbox>

                            </div>

                        </ng-template>

                    </e-column>

                    <e-column field='cf' headerText='CF' width='30'>

                        <ng-template #template let-ds>

                            <div>

                                <ejs-checkbox id='check{{ds.id}}' #checkbox [checked]=ds.cf disabled></ejs-checkbox>

                            </div>

                        </ng-template>

                    </e-column>

                </e-columns>

            </ejs-treegrid>

        </div>

What I currently have in my ts file:

  // public contextMenu: any

  public contextMenuSettings: any;

  public contextMenuItems: MenuItemModel[];

  // public contextMenuItems: Object[];

  public editSettings: Object;

  constructor() { }

  ngOnInit() {

    // this.contextMenu = {

    //   showContextMenu: true,

    //   ContextMenuItems: [

    //       {  text: 'Cut'},

    //       { text: 'Copy'},

    //       { text: 'Paste' }]

    // }

    // this.contextMenuSettings = {

    //   showContextMenu: true,

    //   ContextMenuItems: ["add", "edit", "delete"]

    // }

    this.editSettings = { allowEditing: true, allowAdding: true, allowDeleting: true, mode: "Row" };

    

    // this.contextMenuItems = ['PdfExport', 'ExcelExport', 'CsvExport' ];

    

    this.contextMenuItems = [

      {  text: 'Cut' },

      {  text: 'Copy' },

      {  text: 'Paste'}];

      

    this.ds = [{

      id: 0,

      name: "board",

      title: "company board",

      smf: true,

[Manivannan Padmanaban]

Hi Anthony, 

Greetings from Syncfusion Support. 

We are unable to reproduce the reported issue at our end. For your convenience we have created the sample based on the shared code example, refer to the below link. 

https://stackblitz.com/edit/angular-8zkhr4-7nmbf8 

we also, suggest you to refer our below demo links. 

https://ej2.syncfusion.com/angular/demos/#/material/treegrid/contextmenu-default 

https://ej2.syncfusion.com/angular/demos/#/material/treegrid/custom-contextmenu 

Still facing an issue, please get back to us with the below details. 

1. Confirm whether are you receives any script error in the console. If yes, please share the stack trace.
2. Share the produce version are you using.
3. Reproduce the issue in the shared Or share the issue reproduceable sample.

Provided details will help us, to resolve the reported issue as early as possible. 

Regards, 

Manivannan Padmanaban 

[Anthony]

Thanks for responding and for the stackblitz, I saw that in the app.module you used TreeGridAllModule whereas I was using the TreeGridModule, switching this has fixed the issue.

Many thanks,

Anthony

[Manivannan Padmanaban]

Hi Anthony, 

Thanks for the update. 

We are pleased to hear the problem reported was resolved. 

Kindly get back to us, if you need further assistance. We will be happy to assist you. 

Regards, 

Manivannan Padmanaban