时间戳

首页 > 解决方案 > 如何在不同组件的 Nebular 菜单中更改 AutoCollapse 值 true/false？

angular - 如何在不同组件的 Nebular 菜单中更改 AutoCollapse 值 true/false？

问题描述

HTML 代码： 

<nb-menu *ngIf="enableCollapse == true" autoCollapse [items]="menu"></nb-menu>
<nb-menu *ngIf="disableCollapse == true"  [items]="menu"></nb-menu>
<router-outlet></router-outlet>

组件.ts

export class MainComponent { 
    enableCollapse: boolean = true;
    disableCollapse: boolean = false; 
    menu = MENU_ITEMS;
}

在某些组件中，在路由时我必须保持 AutoCollapse 禁用，而在某些组件中，它已启用，那么如何从其他组件传递 True/false 值，以便在某些页面中启用侧边栏菜单自动折叠某些页面它被禁用。任何帮助表示赞赏

标签： angularnebular

解决方案

您可以像这样简单地将true/false值传递给autoCollapse属性：

<nb-menu autoCollapse="false" [items]="menu"></nb-menu>

或者

<nb-menu [autoCollapse]="enableCollapse" [items]="menu"></nb-menu>

作为旁注，不需要两个变量来控制该autoCollapse功能，只需一个标志就足够了。

推荐阅读