angular - TS2416 : Property 'canActivate' in type 'MyGuard' is not assignable to the same property in base type 'CanActivate'

Question

我写了一个 angular 4.3.0 typescript 库。在构建我的库时，我在 *.d.ts 文件中看到以下错误。

ERROR in [at-loader] ..\myLibrary\lib-commonjs\my-guard.service.d.ts:13:5 TS2416: Property 'canActivate' in type 'MyGuard' is not assignable to the same property in base type 'CanActivate'. Type '(next: ActivatedRouteSnapshot, state: RouterStateSnapshot) => boolean | Promise | Observ...' is not assignable to type '(route: ActivatedRouteSnapshot, state: RouterStateSnapshot) => boolean | Observable | Pr...'. Type 'boolean | Promise | Observable' is not assignable to type 'boolean | Observable | Promise'. Type 'Observable' is not assignable to type 'boolean | Observable | Promise'. Type 'Observable' is not assignable to type 'Promise'. Property '[Symbol.toStringTag]' is missing in type 'Observable'.

这是我的守卫的样子

  @Injectable()
    export class MyGuard implements CanActivate {
         canActivate( next: ActivatedRouteSnapshot ,state: RouterStateSnapshot):  Observable<boolean> | Promise<boolean> | boolean  {
return true;
        }
    }

在我从 canActivate 中删除返回类型(Observable | Promise | boolean)后，错误消失了。我想了解为什么我需要删除它才能使其正常工作。

 canActivate( next: ActivatedRouteSnapshot ,state: RouterStateSnapshot)  {
    }

错误

Answer 1

您遇到的错误是因为您复制了与您正在使用的不同版本的 Angular 的代码。

当您删除返回值时错误消失了，因为您使该函数与您机器上的版本兼容。

您可以通过在您的计算机上导航到 CanActivate 来检查当前版本的函数签名。如果您使用的是 Visual Studio Code，则可以按 Ctrl 键并单击它以导航到它的文件。