@inax/buttonmenuui

module for a generic menu system

Install

You can install this package with npm.

npm

npm install @inax/buttonmenuui

Documentation

To implement a buttonmenu into your application, you need to:

- import MenuModule and ButtonMenuModule into your Module
- add to your HTML-code
- provide the desired menu structure (described in the following section)

$3

1. create a file menu.ts in your app-directory (e.g. /app/resources)
2. provide a token for the menu, you can just copy the following into your file from step 1:
``

ts

import { IMenuItem, BUTTONMENU_TOKEN, DefaultMenuItem } from '@inax/menu';



export function createMenu(): Array  {

    return [

            new DefaultMenuItem(0, 'Main', '', [

                new DefaultMenuItem(0, 'Text-on-the-button', '/path-to-page'),

                new DefaultMenuItem(1, 'Text-on-next-button', '/path'),

                new DefaultMenuItem(2, 'you can also add layers', '', [

                    new DefaultMenuItem(0, 'nested item')

                    // the ID-number as the first parameter should be unique inside an array

                    // --> ID's inside of []-brackets cannot interfere with numbers outside of

                    //     The brackets (and the ones outside don't affect the ones inside)

                ])

            ]),

            new DefaultMenuItem(1, 'TopLevelItem', '', [

                // add more items here to access them via the "TopLevelItem" button

            ]),

            new DefaultMenuItem(2), // empty items to fill the line

            new DefaultMenuItem(3),

            new DefaultMenuItem(4),

            new DefaultMenuItem(5),

            new DefaultMenuItem(6),

            new DefaultMenuItem(7)

        ];

}



export const APP_MENU: any = {

  provide: BUTTONMENU_TOKEN,

  useFactory: createMenu

};



3. customice the returned value of the

createMenu()`-function to suit your application

License