Enable left click on context-menu

[emmanuel-D]

How can I open the context-menu with left click? PS: It works fine with the right click. I have already try this link link, but it don't work for me. Here is the code:

HTML:

   <button
             *ngIf="$last && hasSubmenu"
             (click)="onContextMenu($event, row)"
             class="tl-grid-contextMenu cellButton btn btn-default btn-xs pull-right"
             [contextMenu]="rowContextMenu"
              [contextMenuSubject]="row"
              [hidden]="!row.entity.showSubmenu">
              <i class="fa fa-ellipsis-h"></i>
          </button>

       <context-menu #rowContextMenu>
          <ng-container *ngFor="let action of row.entity.contextMenuOptions">
          <context-menu #subActions>
            <ng-template *ngFor="let subAction of action.subActions" let-item contextMenuItem
                   (execute)="subAction.click($event.event, $event.item)" [enabled]="action.enabled">
               {{subAction.html()}}
            </ng-template>
           </context-menu>
       <ng-template let-item contextMenuItem [subMenu]="action.subActions && subActions"
                 (execute)="action.click($event.item)" [enabled]="action.enabled">
            {{ action.html() }}
            </ng-template>
          </ng-container>
        </context-menu>

And the TS:

   import {Component, OnInit, Input} from '@angular/core';
     import {ContextMenuService} from "ngx-contextmenu";

    @Component({
     // tslint:disable-next-line:component-selector
     selector: '[app-tl-grid-row-template-default]',
     templateUrl: './tl-grid-row-template-default.component.html',
     styleUrls: ['./tl-grid-row-template-default.component.css']
     })
     export class TlGridRowTemplateDefaultComponent  implements OnInit {

     @Input() row: any;

     constructor(private contextMenuService: ContextMenuService) {
     }

    ngOnInit() {
    }

    public onContextMenu($event: MouseEvent, item: any): void {
     this.contextMenuService.show.next({
      contextMenu: this.row.entity.contextMenuOptions,
      event: <any>$event,
      item: item,
     });
    $event.preventDefault();
    }
    }

Thanks for answer.

[isaacplmann]

This line contextMenu: this.row.entity.contextMenuOptions, should be either removed (if there is only one context menu on the page) or changed to contextMenu: this.rowContextMenu, where this.rowContextMenu is a reference to #rowContextMenu in the template.

[emmanuel-D]

Thanks. Work great