Is it possible to have a Menu without the input and dropdown arrow

Is it possible to have a Menu without the input and dropdown arrow

Posted by: eh1160 on 21 January 2019, 5:19 pm EST

• 

  eh1160

  • Post Options:
  • Link
    Copy
  • Jump To Answer

  Posted 21 January 2019, 5:19 pm EST

  I’m wondering if it is possible to have an Angular 2+ menu https://demos.wijmo.com/5/angular2/explorer/explorer/#/input/menu without the input control (with it’s input box and dropdown arrow)

  Or another approach would be to use a WjContextMenu with a left click trigger instead of a right-click trigger.

• 

  sharad.tomer

  

  • Post Options:
  • Link
    Copy

  Posted 22 January 2019, 2:35 am EST

  Hi,

  Yes, you may do by hidden the menu by setting style.display property to ‘none’ and then use menu.show() method to show menu on click.
  
  Please refer to the following code snippet and sample:

  // create menu
  <wj-menu #menu [style.display]="'none'" (itemClicked)="menuItemClicked(menu, $event)" (initialized)="initMenu(menu)">
    <wj-menu-item [value]="'cut'">Cut</wj-menu-item>
    <wj-menu-item [value]="'copy'">Copy</wj-menu-item>
    <wj-menu-item [value]="'paste'">Paste</wj-menu-item>
    <wj-menu-separator></wj-menu-separator>
    <wj-menu-item [value]="'find'">Find</wj-menu-item>
    <wj-menu-item [value]="'replace'">Replace</wj-menu-item>
  </wj-menu>
  // show menu
  document.addEventListener('click', (e)=>{
        if(wjcCore.hasClass(e.target as HTMLElement, 'menu-owner')){
          if(this.menu){
            this.menu.owner = e.target;
            this.menu.show(e);
          }
        }
      });
  

  https://stackblitz.com/edit/angular-1b7vab?file=src%2Fapp%2Fapp.component.ts

  ~Sharad