Angular canActivate文档示例-一般理解

来自 有几件事我正在努力解决：

一,。 类

Permissions

和

CanActivateTeam

包含一个名为

canActivate

的函数。这一良好做法如何？这让我很困惑，尤其是因为我们在

canActivate

（

）

函数中调用

这个
权限
可以激活

二,。
canActivate总是返回true。我不明白为什么

class UserToken {}
class Permissions {
  canActivate(user: UserToken, id: string): boolean {
    return true;
  }
}

@Injectable()
class CanActivateTeam implements CanActivate {
  constructor(private permissions: Permissions, private currentUser: UserToken) {}

  canActivate(
    route: ActivatedRouteSnapshot,
    state: RouterStateSnapshot
  ): Observable<boolean|UrlTree>|Promise<boolean|UrlTree>|boolean|UrlTree {
    return this.permissions.canActivate(this.currentUser, route.params.id);
  }
}

@NgModule({
  imports: [
    RouterModule.forRoot([
      {
        path: 'team/:id',
        component: TeamCmp,
        canActivate: [CanActivateTeam]
      }
    ])
  ],
  providers: [CanActivateTeam, UserToken, Permissions]
})
class AppModule {}

class UserToken{}
类权限{
canActivate（用户：UserToken，id:string）：布尔值{
返回true；
}
}
@可注射（）
类CanActivateTeam实现CanActivate{
构造函数（私有权限：权限，私有currentUser:UserToken）{}
激活(
路由：ActivatedRouteSnapshot，
状态：RouterStateSnapshot
)：可观察的|承诺|布尔| UrlTree{
返回this.permissions.canActivate（this.currentUser，route.params.id）；
}
}
@NGD模块({
进口：[
RouterModule.forRoot([
{
路径：'team/：id'，
组成部分：TeamCmp，
canActivate:[CanActivateTeam]
}
])
],
提供者：[CanActivateTeam、UserToken、权限]
})
类AppModule{}
CanActivate团队是
CanActivate
角度路由防护机制的一个实现

它用于防止用户访问路由（canActivate）或一组路由（canActivateChild）。它还可用于在访问路由之前解析数据（从webservice加载/检查身份验证）

实现
CanActivate
接口时，必须提供
CanActivate
函数，该函数必须返回布尔值、承诺值或可观察值。
在您给出的示例中，调用了一个外部服务来处理该逻辑。这种做法是好的，因为将客户分开总是好的（路线守卫是一回事，许可服务是另一回事）

然后使用
CanActivateTeam:：canActivate
方法
PermissionService:：canActivate
来了解用户是否可以访问此路由

在
PermissionService:：canActivate
中，由您自己编写逻辑代码（调用WS、检查cookie等），我猜他们会使用一个简单的
return true
，以避免使简单示例复杂化

Permissions
类有一个
canActivate
方法，但这是一个巧合。他们可以把它叫做
foo
：他们这样叫它是因为很清楚它的用途（一旦你知道
canActivate
在Angular中的意思。同样，如果你在一个类中看到一个
intercept
，这个类很有可能被用于一个拦截器
对于
CanActivateTeam
类，它有一个
canActivate
函数，因为它实现了
canActivate
接口。这是Angular创建的一个很好的实践：您应该始终实现与框架的某些挂钩相对应的接口。这对于
HttpInterceptor
之类的事情是有效的>，
OnInit
，
AfterViewInit
等

这些接口虽然不是必需的，但强烈建议使用

这是一个实现的示例，仅此而已。他们只给出了一般语法，不希望API文档对示例进行详细说明。它描述了类的角色、变量、方法、类型和签名
使其简短明了，
canActivate
应返回布尔值，或布尔值的承诺/可观察值

如果布尔值为truthy，则您可以访问受保护的路由。如果不是，则取消导航，您必须向用户显示一条消息，说明他无法访问应用程序的这一部分。
我想不出这部分文档的解释，我认为描述很好，但代码片段很糟糕，不是吗最好创建一个主保护（实现CanActivate），每次你需要修改你的保护程序对组件的工作方式时，你都会创建一个类来扩展并覆盖canActivate方法？@Florian你不需要在Angular中扩展类，而是编写！不，这不是更好，这是个人的偏好：对我来说，我会使用提供者工厂来重写我的服务并将其注入不同的模块是的，没有“最佳方式”，只有良好的实践和个人偏好！嗯，有趣的是，我甚至没有想到工厂。你说“你在写作中不扩展类”是什么意思你没有
X类扩展了Y
，你
X类实现了W、Y、Z
。制作了一个非常有趣的视频！我创建了自定义字段表单，这些表单是组件（复选框、日期、输入等）谁都继承了一个通用的FormFieldComponent。我想知道你为什么说我不应该这么做？谢谢你的链接，我现在就去看。