使用Angular和WebApi实现基于角色的安全性的方法

Question

我一直在阅读一堆不同的帖子和问题。我是Angular的新手，正在寻找一个关于如何使用角色保护角度应用程序的示例。

我在互联网上看到的一点点是使用服务进行身份验证并向用户提供令牌;我假设这个令牌随后在用户会话期间保存在Angular服务中。

我想了解如何设置客户端（角度）路由和模型安全性（显示/隐藏/启用/禁用特定字段）和服务器端（Web API）的示例。

到目前为止，我的想法是：

1. 创建一个安全控制器，登录表单将发布到该控制器并实现逻辑以发出令牌
2. 使用Authorization属性保护剩余的WebApi控制器，该属性将在令牌丢失/无效的情况下发出403
3. 实现资源的服务器端处理（授权时），返回模型，只有用户有权查看的属性（模型属性上的海关数据注释）
4. 在客户端上实施403处理（不知道从何处开始）
5. 实现模型的视图呈现，其中可以根据角色启用/禁用字段（即用户可以看到但不能编辑）（指令）？

关于如何（正确）执行此操作的具体示例 - 考虑到当前的安全预防措施将会有所帮助。