Visible Property of APP-Menu in Serinity
Posted: 03 Dec 2018, 13:28
What is the purpose of visible property in app.menu.component.html in Serenity
<p-scrollPanel #scrollPanel [style]="{height: '100%'}">
<ul app-submenu [item]="model" root="true" class="layout-menu" visible="true" [reset]="reset" parentActive="true"></ul>
</p-scrollPanel>
My task is I want to hide the dashboard and display only menu modes. instead of changing the model, how can I achieve it ? Is there any property I can add to it?
this.model = [
{label: 'Dashboard', icon: 'dashboard', routerLink: ['/']},
{
label: 'Menu Modes', icon: 'settings',
items: [
{label: 'Static Menu', icon: 'view_quilt', command: (event) => {this.app.layoutMode = 'static'; }},
{label: 'Overlay Menu', icon: 'flip_to-front', command: (event) => {this.app.layoutMode = 'overlay'; }},
{label: 'Horizontal Menu', icon: 'border_horizontal', command: (event) => {this.app.layoutMode = 'horizontal'; }},
{label: 'Light Menu', icon: 'label', command: (event) => {this.app.darkMenu = false; }},
{label: 'Dark Menu', icon: 'label_outline', command: (event) => {this.app.darkMenu = true; }},
{
label: 'Orientation', icon: 'format_align_right',
items: [
{label: 'LTR', icon: 'format_align_left', command: (event) => {this.app.isRTL = false; }},
{label: 'RTL', icon: 'format_align_right', command: (event) => {this.app.isRTL = true; }}
]
}
]
}]
<p-scrollPanel #scrollPanel [style]="{height: '100%'}">
<ul app-submenu [item]="model" root="true" class="layout-menu" visible="true" [reset]="reset" parentActive="true"></ul>
</p-scrollPanel>
My task is I want to hide the dashboard and display only menu modes. instead of changing the model, how can I achieve it ? Is there any property I can add to it?
this.model = [
{label: 'Dashboard', icon: 'dashboard', routerLink: ['/']},
{
label: 'Menu Modes', icon: 'settings',
items: [
{label: 'Static Menu', icon: 'view_quilt', command: (event) => {this.app.layoutMode = 'static'; }},
{label: 'Overlay Menu', icon: 'flip_to-front', command: (event) => {this.app.layoutMode = 'overlay'; }},
{label: 'Horizontal Menu', icon: 'border_horizontal', command: (event) => {this.app.layoutMode = 'horizontal'; }},
{label: 'Light Menu', icon: 'label', command: (event) => {this.app.darkMenu = false; }},
{label: 'Dark Menu', icon: 'label_outline', command: (event) => {this.app.darkMenu = true; }},
{
label: 'Orientation', icon: 'format_align_right',
items: [
{label: 'LTR', icon: 'format_align_left', command: (event) => {this.app.isRTL = false; }},
{label: 'RTL', icon: 'format_align_right', command: (event) => {this.app.isRTL = true; }}
]
}
]
}]