Question

我正在尝试在Angular 7中建立一个简单的canDeactivate保护，并且我已经尝试了许多在线教程中的代码，但是它们都产生相同的错误：

“类型'CanDeactivate'不是通用的。”

我在做什么错？除了出现相同问题的另外2年未回答的问题以外，我什至在所有Google匹配中都找不到此错误。

在此处查看代码：

import { Injectable } from '@angular/core';
import { ActivatedRouteSnapshot, RouterStateSnapshot } from '@angular/router';
import { Observable } from 'rxjs';
import { CanDeactivate } from '@angular/router/src/utils/preactivation';

export interface CanDeactivateComponent {
    canDeactivate: () => Observable<boolean> | boolean;
}

@Injectable()
export class CanDeactivateGuard implements CanDeactivate<CanDeactivateComponent> {
    canDeactivate(component) {
        return component.canDeactivate ? component.canDeactivate() : true;
    }
}

Answer 1

您的A,B,C导入错误。您必须像这样从CanDeactivate导入它：

@angular/router

这将导出正确的界面以在您的项目中使用。这是一个通用接口，带有用于您的组件类型的类型参数：

import { CanDeactivate } from '@angular/router';

根据您的导入，Angular存储库中的文件preactivation.ts会导出一个具有相同名称的接口，但其用法似乎在角度库内部，而不是要在其外部使用：

export interface CanDeactivate<T> {
  canDeactivate(
      component: T, currentRoute: ActivatedRouteSnapshot, currentState: RouterStateSnapshot,
      nextState?: RouterStateSnapshot): Observable<boolean|UrlTree>|Promise<boolean|UrlTree>|boolean
      |UrlTree;
}

此接口不是通用接口，没有类型参数，这就是为什么在使用这种接口时会出错：

export class CanDeactivate {
  constructor(public component: Object|null, public route: ActivatedRouteSnapshot) {}
}

canDeactivate问题：“类型'CanDeactivate'不是通用的”

1 个答案: