2 Replies Latest reply: Aug 13, 2018 8:34 AM by Bala Bhaskar RSS

    How to add custom navMenu items in Qlik Sense Extension?

    Dhwanil Shah

      Hello Everyone,

              I need to add custom menu Items to my qlik sense extension as below:

       

      ss.png        

      I have explored a little bit and saw this in the DOM:

       

      ```

      <a ng-repeat="menuItem in navMenu.items" ng-if="menuItem.isVisible()" ng-class="[menuItem.cssClasses, menuItem.dynamicCssClasses()]" qva-activate="menuItem.action()" q-title-translation="Tooltip.ZoomIn" tid="nav-menu-zoom-in" class="ng-scope lui-icon lui-icon--expand white border" title="Full screen"></a>

      ```

       

      But I am not sure how to add my custom items in this navMenu, any ideas or suggestions are welcome.

       

      Thank you in advance.

        • Re: How to add custom navMenu items in Qlik Sense Extension?
          Dhwanil Shah

          I found the solution while going through the $scope object.

          The navMenu object is located at: $scope.$parent.$parent.navMenu

           

          To add custom option, create a object as below:

                         var customBtnNavMenu = {

                             'action': $scope.callBackFunction, // main callback function for the nav menu

                             'cssClasses': 'lui-icon lui-icon--cogwheel white border', // css classes

                             'isVisible': isVisible, // call back function to decide visibility

                             'tid': 'nav-menu-custom', // unique identifier

                             'translation': 'My Custom Nav Option' // title that shows up on hovering

                         };

           

          Add it to the nav Menu:

                              $scope.$parent.$parent.navMenu.items.push(customBtnNavMenu);

           

          Thank You!