0

モジュール 2 がモジュール 1 内に表示されるのはなぜですか?

複数のモジュールを含む 1 つの角度付きアプリがあります。一部のモジュールでは、コンポーネント ルーターを使用したいと考えています。コンポーネントがどのページ (url) にロードされるかはわかりません。

現在の状況: モジュール 1 内で、モジュール 2 のテンプレートが表示されています。

望ましい結果:
'...com/someUrlWhereModule1Lives#/step2' がモジュール 1 のステップ 2 をロードする '...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'
});

デモへのリンク

さらに情報が必要な場合は、お知らせください。

4

1 に答える 1

1

Angular アプリを単一のページャーとして使用していないため、モジュール (例: module-one) がモジュールのルーティングを保持する $routerRootComponent (例: component-router-component) を開始するという回避策を作成しました。$routerRootComponent は、独自の $routeConfig を持つ別のコンポーネント (例: module-one-overview) を開始します。

コード例については、私のPlunkerを参照してください。

(申し訳ありませんが、Plunker URL を参照するときにコードを要求する Stackoverflow 機能を回避するために、この URL を短縮する必要がありました)

于 2016-05-17T09:48:55.063 に答える