参数 'activatedRoute' 和 'route' 的类型不兼容

Question

我有这样的守卫 details.guard.service.ts

import { Injectable } from '@angular/core';
import { CanActivate, ActivatedRoute } from '@angular/router';

import { AuthService } from '/auth-service';

import { AuthorizationRoles } from './constants';
import { Tags } from './tags';

/**
 * This will guard route
 */
@Injectable()
export class DetailsGuardService implements CanActivate {

  constructor(private authService: AuthService) { }

  /**
   * Returns whether or not user can see details
   */
  canActivate(activatedRoute: ActivatedRoute): boolean {
    const type = activatedRoute.params['details'];
    if (Tags.includes(type)) {
      return this.authService.roles.some(role => role === AuthorizationRoles.readDetails);
    }
  }
}

我遇到的错误

details.guard.service.ts(20,3) 中的错误：错误 TS2416：属性 “DetailsGuardService”类型中的“canActivate”不可分配给 基本类型“CanActivate”中的相同属性。输入'（激活路由： ActivatedRoute) => boolean' 不可分配给类型 '(route: ActivatedRouteSnapshot，状态：RouterStateSnapshot) => boolean | 网址树 |可观察 |承诺'。 参数 'activatedRoute' 和 'route' 的类型不兼容。 “ActivatedRouteSnapshot”类型中缺少属性“快照”，但在“ActivatedRoute”类型中是必需的。

我不知道在哪里看，任何帮助都会很好，谢谢

Answer 1

首先，需要将激活的路由注入到构造函数中。但你应该使用ActivatedRouteSnapshot

canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot) : Observable<boolean>

当您无法导航时，您也应该返回 false。

考虑以下代码：

canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot): boolean {
    const type = route.params['details'];
    if (Tags.includes(type)) {
      return this.authService.roles.some(role => role === AuthorizationRoles.readDetails);
    } else
    {
        return false;
    }


  }