子路由中的延迟加载模块

时间:2019-12-21 18:49:44

标签: angular typescript

我只是有一个问题,当我按角度延迟加载子级子级时,不会加载我的组件。解析器由于某种原因而加载。

详细地,我已经在我的应用程序路由模块中加载了子路由。对于这种情况,我使用了提到的延迟加载。这些子路由已加载,没有任何问题,但是如果我要在此路由中加载另一个子路由,则会出现问题。代码的结构相同,但是由于某种原因,它无法在更深的一层上工作。 你们当中是否有人有这个用例的代码示例,所以知道为什么会这样吗?

编辑的更多详细信息: 我已经为app.module创建了一个解析器(您可以识别它是否被console.log加载)。 Angulars的正常行为是,如果您在URL中输入(... stackblitz / first / second),则加载解析器。 如果我将其声明为childs,则不再加载该组件,但解析器仍然加载。

以下是链接:https://stackblitz.com/edit/angular-6csggp

最诚挚的问候! :)

1 个答案:

答案 0 :(得分:1)

个人路线

正如我在评论中已经提到的那样,无论您要实现哪种深度,LazyLoading的工作原理都相同。我创建了一个小的StackBlitz,以举例说明其工作原理。

嵌套路线(儿童)

如果您要将路线声明为子级(根据我的阅读,这就是您想做的事情),angular将尝试将其作为嵌套导航加载。粗略地解释,这意味着您的app.component有一个<router-outlet>,该主机托管了app-routing.module中的父组件。在您的路线中声明的子级将依次加载到位于父级组件中的<router-outlet>中。如果多个路由具有某些共同点(例如报头),通常使用这种路由方法,因此不应在每个路由中都重复该路由方法。

或者,换句话说,与导航树中每个级别匹配的组件将在彼此下方显示,而不是彼此替换。因此,在您的情况下,他们可能会解决,但没有<router-outlet>可以居住。

我修改了StackBlitz的分支,以向您展示嵌套导航如何与LazyLoading一起工作。另外,还有一个直接链接,即使直接打开/top-level-nested/first-child/second-childhttps://angular-juudzm.stackblitz.io/top-level-nested/first-child/second-child

,您也可以看到一切都在加载中
相关问题