标签：菜单 alain ts ng 设置 权限 路由 acl
权限：基于权限点来做（菜单权限、按钮权限）
先来说一下整个权限这块的整体思路：
- 权限管理：每个菜单及按钮都会有响应的权限代码。数据类型为树结构。
- 菜单管理：每个菜单会绑定一些权限点。（将新建的菜单和权限点做个绑定）
- 角色管理：角色创建之后会也会给角色赋予一些权限点。
- 人员管理：给人员分配角色。
以上就是后台系统对权限的管理。
当时后台这么设计的时候，我提出了疑问：菜单管理绑定的权限点为什么是一些，每个菜单绑定的不应该是对应的唯一的一个么？原因是菜单下面还有按钮级别的权限点需要进行绑定。
角色和人员就不用细说了，后台管理基本都这么做。
但是至于设计上，出于各种因素的权衡考虑，每个人和每个团队都有不一样的设计。
登录之后：后台会给我们什么？我们需要怎么去做？
回答是：登录后，后端会把整个菜单返回给我们，菜单带有相应权限点。同时也会把该用户拥有的所有权限点给我们。 我们需要根据返回的菜单和权限 来做菜单和按钮权限。接下来就是具体实现：我们到底需要怎么去处理呢？对于刚使用ng-alain的我，摸着文档前进还摔了不少跤......
菜单权限：
尝试在startup.service.ts中使用 this.aclService.setRole(['role4']); 设置角色 然后在根路由routes-routing.module.ts 中设置 路由的角色
问题在于：路由的角色是动态配置的，难道后台系统调整前端代码就得修改？并且角色可以是多个
尝试解决：使用权限点
在startup.service.ts中使用 this.aclService.setAbility(res.auth);设置权限点
然后在根路由routes-routing.module.ts 中设置路由权限点
问题在于：这个是针对模块，对于每个路由都应该有相应的权限点
最终解决：在每个子路由中都设置相应的权限点
在startup.service.ts中使用 this.aclService.setAbility(res.auth);设置权限点
然后在根路由routes-routing.module.ts 中设置ACLGuard
{
path: 'order',
loadChildren: () => import('./order/order.module').then(m => m.OrderModule),
canActivateChild: [ACLGuard]
}
最后在相应模块的每个路由中设置相应的权限点
解决了以上问题：
之前一直困扰的路由拦截问题也就解决了。 每个路由都有相应的权限点，根据权限点拦截，就不存在打开了没有权限的页面
解决了路由拦截问题：接下来的问题就是如何过滤菜单（后台会把所有的菜单返回-菜单带有相应权限点 并且会返回该用户对应的所有权限点）
首先想到的是通过用户对应的权限点去和整个菜单做比对，将权限点匹配的菜单过滤出来就是展示的菜单。 接着acl是不是提供了相关配置。 以下是acl提供的相关配置总结： 第一步：menu中的acl参数 ，只要在 menu中设置acl参数，如果是字符串，acl会解析成 角色 第二步：更改menu中的acl参数 为 {ability:["main"]} 会被解析成权限点 第三步：在startup.service.ts中已经设置了权限点 this.aclService.setAbility(res.auth); acl会根据用户拥有的权限点过滤菜单。
总结：
1. menu接口中设置acl。 acl:{"ability": ["system"]} 2. menu接口返回 auth:[] 。用户拥有的权限点 3. 在 startup.service.ts中，设置菜单和权限点 this.menuService.add(res.menu); this.aclService.setAbility(res.auth); 4. 在相应路由中设置权限点。 比如：在auth-routing.module.ts中设置 { path: 'user', component: AuthUserComponent, data: { guard: { ability: ['auth-user'] } } } 以上配置实现 菜单控制及路由拦截 按钮权限: <button acl [acl-ability]="'order-list'">测试权限点</button>标签：菜单,alain,ts,ng,设置,权限,路由,acl 来源： https://www.cnblogs.com/aries-web/p/16338149.html
本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享； 2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关； 3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关； 4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除； 5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。