ngxux-mat-vertical-toolbar

Configurable Material Vertical Toolbar

Installing

$ npm install @ngxux/mat-vertical-toolbar

Usage

First we'll add our component to our template with:

app.component.html
<ngxux-mat-vertical-toolbar></ngxux-mat-vertical-toolbar>

Next we'll inject the NgxuxMatVerticalToolbarService and configure our menu with:

app.component.ts
public constructor(private ngxuxMatVerticalToolbarService: NgxuxMatVerticalToolbarService) {
ngxuxMatToolbarService.menuItems = [
new NgxuxMatToolbarItem({ icon: 'home', path: '/home', tooltip: 'Go home!', color: '#fff', hoverColor: 'red' }),
new NgxuxMatToolbarItem({ icon: 'settings', path: '/settings', tooltip: 'Go settings!' }),
];
ngxuxMatVerticalToolbarService.leftMenuItems = [
new NgxuxMatVerticalToolbarItem({ icon: 'home', path: '/home', tooltip: 'Go home!' }),
new NgxuxMatVerticalToolbarItem({ icon: 'settings', path: '/settings', tooltip: 'Go settings!' }),
new NgxuxMatVerticalToolbarItem({ icon: 'supervised_user_circle', path: '/settings/users', tooltip: 'Go settings!' }),
];
ngxuxMatVerticalToolbarService.click$.subscribe((item: NgxuxMatVerticalToolbarItem) => {
console.log(item);
});
}