1.2.0 • Published 4 years ago
ng-responsive-navbar v1.2.0
Navbar
Usage
Add the following in your html
<lib-navbar [navBarData]="navBarData" (clickMenuEntry)="onClickMenuEntry($event)"></lib-navbar>
Add the following in your ...component.ts
public navBarData: INavbarData = this.getNavBarData();
private getNavBarData(): INavbarData {
return {
// replace the following by your data...
logoURL: 'https://fance-stiftung.de/api/app/app-images/logo.png',
appTitle: 'App Title',
menuEntries: [{
isActive: true,
text: 'Menu Entry 1',
href: '/menuEntry1',
},
{
isActive: false,
text: 'Menu Entry 2',
href: '/menuEntry2',
},
{
isActive: false,
text: 'Menu Entry 3',
href: '/menuEntry3',
}]
};
}
public onClickMenuEntry(target: string) {
alert(target);
}
Add the following in your app.module.ts
import { NavbarModule } from 'ng-responsive-navbar';
imports: [
NavbarModule,
To use the full screen make sure your body style="margin: 0;"