为非授权用户禁用字段的通用解决方案答案

【问题标题】：Generic solution for disabling fields for non-authorized users为非授权用户禁用字段的通用解决方案
【发布时间】：2016-08-29 17:47:43
【问题描述】：

我有一个客户端语言是 Angular 2 的项目。我的应用程序有几个页面，所有页面都有不同的权限。例如，我有一个员工页面、一个书籍页面、一个位置页面、一个打卡页面等。

每个页面都有 CanEdit 和 CanView 权限。登录用户可能拥有位置的 CanEdit 权限，但他可能没有图书页面的 CanEdit 权限。

我想制作一个通用的解决方案，我将在一个地方编写并适用于所有页面，我不想在所有页面中重复代码。例如：如果用户对当前页面有 CanEdit 权限，则删除所有输入的只读属性，如果他没有 CanEdit 权限，则添加只读属性。

目前项目中没有角色，但我愿意接受建议。

这样可以吗？

【问题讨论】：

【解决方案1】：

我能想象的最好的解决方案是创建一个具有用户的 CanEdit 和 CanView 状态的服务。然后，在您的 html 页面上，使用：

<button *ngIf="userService.CanView">a button</button>

显示/隐藏（实际上，使其存在或不存在）您想要显示的元素

【讨论】：

您的意思是在服务中，用户在应用程序的每个页面上都会有如下状态：CanViewLocations、CanEditLocations、CanViewBooks、CanEditBooks？
取决于您想要的权限精度级别。最基本的方法是只有两种状态：CanView 和 CanEdit，最终在任何页面上使用它们。您只需在要保护的按钮/字段/div 上添加 *ngIf 条件

【解决方案2】：

您可以使用 CanView、CanRead 等指令和一个共享服务来检查用户是否可以阅读或编辑页面。在指令中，如果用户没有 CanView 权限，您将能够重定向用户，或者如果他没有 CanEdit 权限，则禁用所有输入

【讨论】：