Angular 4延迟加载参数

发布时间：2020-12-17 06:52:02 所属栏目：安全来源：网络整理

导读：您好我试图延迟加载“详细模块”,同时通过URL发送参数. 这是我的懒加载路线： { path: 'venue/:name/:id',loadChildren: () = System.import('../containers/activity-detail/activity-detail.module').then((file: any) = { return file.default; })}, 我想

您好我试图延迟加载“详细模块”,同时通过URL发送参数.

这是我的懒加载路线：

{
    path: 'venue/:name/:id',loadChildren: () => System.import('../containers/activity-detail/activity-detail.module').then((file: any) => {
        return file.default;
    })
},

我想路由到这个’activity-detail.module’,然后使用“：name”和“id：”参数加载详细信息.

加载的模块有自己的路由文件.

export const VenueDetailRoutes: Route[] = [
    {
        path: '',redirectTo: 'venue/:name/:id',pathMatch: 'full'
    },{
        path: 'venue/:name/:id',component: VenueDetailComponent,data: {
            shouldDetach: true,// Route will be resused. See CustomResuseStrategy.
            title: null
        }
    },{
        path: '**',redirectTo: '/'
    }

];

似乎没有第一个默认对象没有任何作用.我收到错误：

{
    path: '',pathMatch: 'full'
},TypeError: Cannot read property 'path' of null

使用默认对象我得到错误：

Error: Cannot redirect to 'venue/:name/:id'. Cannot find ':name'.

任何帮助将不胜感激.

解决方法

我认为这不起作用：

{
    path: '',

它无法匹配带参数的路径的“空”路径.

延迟加载路由的语法比我的复杂得多.我看起来像这样：

{
    path: 'movies',loadChildren: './movies/movie.module#MovieModule'
},

请注意,“父”路由(此示例中为“电影”)在延迟加载的路由中定义,并且不会在加载的模块路由中重复.

例如：

RouterModule.forChild([
  { path: '',component: MovieListComponent },{ path: 'search',component: MovieSearchComponent },{ path: ':id',component: MovieDetailComponent }
])

在你的情况下,我认为加载模块的路由应该如下所示：

export const VenueDetailRoutes: Route[] = [
    {  
       path: ':name/:id',// Route will be resused. See CustomResuseStrategy.
            title: null
        }
    }    
];

(尽管您可能需要考虑在基本路由工作之前不要使用自定义重用策略.)

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!