Angular 2 超出预加载最大调用堆栈大小

Question

所以我的问题是我想预加载我所有的子路由模块。我的根路由模块中有以下内容

RouterModule.forRoot(appRoutes, { preloadingStrategy: AppCustomPreloader })

AppCustomPreloader 如下所示

export class AppCustomPreloader implements PreloadingStrategy {

preload(route: Route, load: Function): Observable<any> {
    try {
        return route.data && route.data.preload ? load() : Observable.of(null);
    }
    catch (ex) {
        console.log('error');
    }

}
}

对于我的嵌套路由模块中的每条路由，我都给每条路由一个数据属性："true" 如下所示

{
    path: 'somepage',
    loadChildren: './somedirectory/somemodule.module#SomeModule',
    data: { preload: true }
}

一切都正确预加载，但我在 Firefox 中 chrome 和 "Too much recursion" 中收到 "Maximum Call Stack Size Exceeded" 错误。

我有大约 10 个预加载的模块，它们都相对较小。是堆栈大小实际上太大的问题还是我缺少某种无限路由模块加载的问题。调试这两种可能性的好方法是什么？

Answer 1

不发布你的路线很难说。以下是帮助我构建非常复杂的路由器的一些步骤：

您可以尝试将 RouterModule 导入更改为 RouterModule.forRoot(appRoutes, { preloadingStrategy: AppCustomPreloader, enableTracing: true }) 以更深入地了解正在发生的事情。
查看 Augury，它是一个 Chrome 扩展，可帮助 Angular 应用程序进行调试。适合您情况的关键工具是路由树的可视化表示。

Angular 2 超出预加载最大调用堆栈大小

Angular 2 Eager Loading Maximum Call Stack Size Exceeded

routing

eager-loading

angular