Navigator module

This module is responsible for the navigator menu. It deals with functionalities such as adding/removing entries in the menu, as well as hiding/showing the entire navigator pane.

Usage examples

To make it easier to add entries to the navigator, we have created an auxiliary hook called hookNavigator. With it, you can quickly and easily add new items in the navigator menu. To do this, follow these steps.

In yourModuleName.module.ts

Create menu items such as:

• top entry in the navigator (parent node),
• submenu (child node).

as follows:

import { hookNavigator, NavigatorNode, gettext } from '@c8y/ngx-components';

...

// Parent node (top entry in the hierarchy)
const group = new NavigatorNode({
  label: gettext('Group'),
  path: '/group'
});

// Child node (visible under the group root node)
const subgroup = new NavigatorNode({
  label: gettext('Subgroup'),
  path: '/group/subgroup'
})

group.add(subgroup);

After creating entries for the navigator, we are ready for the final step. In the providers array, we need to use our navigator hook.

@NgModule({
  declarations: [...],
  imports: [...],
  providers: [hookNavigator(group)]
})

For more information on the hook, check out our Web SDK for Angular in the section: see Libraries > Component library > Multi Provider in our Web SDK guide.