如何在菜单数组内的子菜单中过滤角色答案

【问题标题】：How to filter role in submenu inside menu array如何在菜单数组内的子菜单中过滤角色
【发布时间】：2021-06-20 22:05:30
【问题描述】：

我有 sidebar-items.ts

export const ROUTES: RouteInfo[] = [
  {
    path: 'dashboard',
    title: 'dashboard',
    moduleName: 'dashboard',
    role: [Role.COMMUNITY_ADMIN, Role.BOARD_MEMBER,Role.CHAIRMAN,Role.OWNER,Role.TENANT],
    submenu: [],
  },
  {
    path: '',
    title: 'users',
    moduleName: 'users',
    role: [Role.COMMUNITY_ADMIN, Role.OWNER, Role.TENANT, Role.BOARD_MEMBER, Role.CHAIRMAN],
    submenu: [
      {
        path: 'persons',
        title: 'persons',
        moduleName: 'persons',
        role: [Role.COMMUNITY_ADMIN, Role.OWNER, Role.TENANT, Role.BOARD_MEMBER, Role.CHAIRMAN],
        submenu: [],
      },
      {
        path: 'users',
        title: 'users',
        moduleName: 'users',
        role: [Role.COMMUNITY_ADMIN],
        submenu: [],
      },
      {
        path: 'owner/list',
        title: 'owner',
        moduleName: 'owner',
        role: [Role.COMMUNITY_ADMIN, Role.OWNER, Role.TENANT, Role.BOARD_MEMBER, Role.CHAIRMAN],
        submenu: [],
      }
    ],
  },
  {....}]

我的用户登录具有“租户”角色。

我想显示只有 Role.TENANT 的菜单，为此我创建了一个过滤器，如下面的代码。此过滤器仅适用于菜单，不适用于子菜单。我想要一个子菜单过滤器，用户的子菜单。当我使用具有 TENANT 角色的帐户登录时，菜单中不会显示用户/用户，因为用户/用户只有角色：[Role.COMMUNITY_ADMIN]。

this.allowedCommunity = 'community/create';
this.currentUserLoggedIn = this.authService.currentUserLoggedInAccount;
const userRolesFiltered = this.currentUserLoggedIn.user?.user_roles?.filter(
  (userRole: any) =>
    formatDate(userRole.end_date, 'yyyy-MM-dd', 'en_US') >=
    formatDate(new Date(), 'yyyy-MM-dd', 'en_US')
);
this.sidebarItems = ROUTES.filter(
  (x) =>
    userRolesFiltered?.some((userRole: any) =>
      x.role.includes(userRole.role.name)
    )
)

有什么想法吗？

【问题讨论】：

那么，您是否想在 TENANT 角色登录时获得 sub-mneu { path: 'users', title: 'users', moduleName: 'users', role: [Role.COMMUNITY_ADMIN], submenu: [], },？
是的，我只想获得只有角色的子菜单：[Role.TENANT]，因为 TENANT 是我的角色登录
我的解决方案对您有用吗？

标签： arrays angular typescript filter

【解决方案1】：

给你。在StackBlitz查看我的实现

【讨论】：