Question

文档说我不能同时使用这两个功能https://angular.io/docs/ts/latest/guide/router.html#!#canload-blocks-preload

如果用户有权访问路线，我想要实现的是延迟加载路由。

Answer 1

使用两者并不符合逻辑。使用canLoad告诉angular，您希望阻止加载模块，直到解决了防护。因此预加载会考虑到这一点，并且不会预加载此模块。

你为什么要这样做？好吧，假设您有一个管理模块或其他一些敏感模块，您不希望加载这些模块并在检查通过之前进行检查。在这里预防预加载很棒。

如果您真的想要保护自己的路线，但也要预先加载，请使用canActivate代替canLoad。

Answer 2

您可能希望使用 CanActivate 后卫而不是 CanLoad 。通过这种方式，您仍然可以将preloadingStrategy设置为PreloadAllModules，并且它可以有效地预加载“延迟加载”功能的内容。模块即使 canActivate返回false。

Answer 3

为此，您应该使用自定义预加载策略并将canLoad check移至某些服务。因此，例如：

@Injectable()
export class AuthPreloadStrategyService implements PreloadingStrategy {

    public constructor(private authService: AuthService) {
    }

    public preload(route: Route, fn: () => Observable<any>): Observable<any> {
        return this.authService.canLoad(route) ? fn() : Observable.of(null);
    }
}

注意：如果存在canLoad处理程序，则根本不会调用预加载。

应用canLoad预加载延迟路由

3 个答案: