在不同模块中使用角度分量路由

我们有一个包含多个模块的角度应用程序。对于一些模块，我们想使用组件路由器。我们不知道将在哪个页面（url）上加载组件。

当前情况： 模块1内部正在显示模块2的模板。

期望的结果： 有无使得 '... COM/someUrlWhereModule1Lives＃/ step2' 的负载步骤模块的2 1
' ... COM/someUrlWhereModule2Lives＃/ step2' 的负载相对于部件的路径模块的步骤2 2

module1.module.js

angular 
.module('app.module1', ['ngComponentRouter']) 
.value('$routerRootComponent', 'module1') 
.component('module1', { 
    templateUrl: 'module1.overview.html', 
    $routeConfig: [ 
     {path: '/', name: 'Overview', component: 'module1Step1', useAsDefault: true}, 
     {path: '/step2', name: 'Overview', component: 'module1Step2'} 
    ] 
}) 
.component('module1Step1', { 
    bindings: { $router: '<' }, 
    templateUrl: 'module1.step1.html' 
}) 
.component('module1Step2', { 
    bindings: { $router: '<' }, 
    templateUrl: 'module1.step2.html' 
});

module2.module.js

angular 
.module('app.module2', ['ngComponentRouter']) 
.value('$routerRootComponent', 'module2') 
.component('module2', { 
    templateUrl: 'module2.overview.html', 
    $routeConfig: [ 
     {path: '/', name: 'Overview', component: 'module2Step1', useAsDefault: true}, 
     {path: '/step2', name: 'Step2', component: 'module2Step2'} 
    ] 
}) 
.component('module2Step1', { 
    bindings: { $router: '<' }, 
    templateUrl: 'module2.step1.html' 
}) 
.component('module2Step2', { 
    bindings: { $router: '<' }, 
    templateUrl: 'module2.step2.html' 
});

Link to demo

如果需要更多信息，请让我知道。

来源

2016-05-12 S.Honderdos

因为你是使用你的Angular应用程序作为单个寻呼机的情况下我已经做了一些解决方法，你的模块（例如模块一）启动$ routerRootComponent（例如组件路由器组件）模块。 $ routerRootComponent启动具有它自己的$ routeConfig的另一个组件（例如module-one-overview）。

查看我的Plunker的代码示例。

（对不起，我不得不通过短URL来解决指向Plunker URL时需要代码的Stackoverflow功能）

来源

2016-05-17 09:48:55 PizzaPete

在不同模块中使用角度分量路由

回答

相关问题