Question

我想延迟一个完全取决于用户提供的url的组件。更确切地说，它取决于第二个网址段。

这是我读取段然后加载等效模块的方式。

var pathArray = window.location.pathname.split( '/' );
var segment = pathArray[2];

export const routes:Routes = [
    {
        path: "",
        component : DeskComponent,
        children: [
            {
                path: "",
                loadChildren: "app/desk/" + segment + "/" + segment + ".module#" + (segment.charAt(0).toUpperCase() + segment.slice(1)) + "Module"
            }
        ]
    }
];

现在我知道这远非完美。由于这是一个子路由，而父路由实际上传递了参数段desk/:segment，我可以在我的组件中订阅 ActivatedRoute.params 并获取该段。

ngOnInit() {
  this.route.params
    .subscribe((params: Params) => params['segment']);
}

我的孩子路线在某种程度上可能会等待那个参数并调整它的路线吗？我不知道如何将它们组合在一起。

Answer 1

我真的不了解你的路线等级。

不可能像这样预先声明所有可能的路线：

const segments = ['foo', 'bar'];
export const routes: Routes = [];

let capitalizedSegment = segment.charAt(0).toUpperCase() + segment.slice(1);
for (let segment of segments) {
  routes.push({
    path: `some/path/${segment}`
    loadChildren: `app/desk/${segment}/${segment}.module#${capitalizedSegment}Module`
  });
}

Answer 2

我找到了解决方案。我从子模块中删除了路由，并在父模块中定义了所有路由。

我不知道我仍然可以将我的路由器插座保留在我的子模块中。我认为他们还需要一个路由配置。但事实并非如此！所以我可以将我的系统保留在我的子模块中而不需要任何路由配置。

Angular 2 Lazyloading依赖于现有的URL分段

2 个答案: