在nb菜单项中使用* ngIf

时间:2020-04-21 11:03:29

标签: angular ngx-bootstrap nebular

如何在*ngIf菜单中使用<nb-menu [items]="items">? 我有这样的东西

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

和我的.ts

items: NbMenuItem[] = [
    {
      title: 'Aliases',
      icon: 'list-outline',
      link: 'aliases'
    },
    {
      title: 'Aliases to accept',
      icon: 'checkmark-outline',
      link: 'toAccept'
    },

我只想为“ toAccept”授予访问权限

在我做这样的事情之前:

  <li *ngIf="showForAdmin">
        <a href="/toAccept" class="nav-link" routerLink="toAccept">
          <nb-icon icon="checkmark-outline"></nb-icon>Aliases to accept
        </a>
      </li>

效果很好

我该怎么做在神经元上类似的事情?

1 个答案:

答案 0 :(得分:0)

您可以根据.ts文件中的变量添加所需的菜单项

import { USER_MENU_ITEMS } from './pages-menu';
import { NbMenuService, NbMenuItem } from '@nebular/theme';

export class PagesComponent {

  menu = USER_MENU_ITEMS;
  showForAdmin = true;

adminMenuItem: NbMenuItem[] = [
    {
      title: 'Admin',
      group: true,
    },
    {
      title: 'Management',
      icon: 'browser-outline',
      children: [
    {
      title: 'User Details',
      link: '/path/users',
    },
    ],
   },
  ]


constructor( private nbMenuService: NbMenuService ) {
    this.addAdminMenu(this.showForAdmin);
  }

  addAdminMenu(showForAdmin){
    if (showForAdmin === true)
    {
      this.nbMenuService.addItems(this.adminMenuItem);
    }
  }

}

相关问题