2017-09-06 13 views
0

プロジェクト構造: 'app.routing.ts'feature-modulesルートが子として順番に来るように、Angle 4でルーティングを設定するにはどうすればいいですか?

[ 
    { 
    path : '', 
    loadchildren: 'loginModulepath/loginmoduleName#className' 
    }, 
    { 
    path : 'dashboard', 
    component: dashboardReportComponent 
    } 
    { 
    path : 'manage-products' 
    loadchildren: 'manage-productModule-path/manage-product-moduleName#manageProductClassName' 
    } 
] 

モジュールでは

/app 
    app.module.ts 
    app.routing.ts 
    : 
    : 
    /dashboardModule 
    /manage-productModule 
     manage-product.module.ts 
     manage-product.routing.ts 

:管理-製品/管理-product.routing.ts

const manageProdRoute = 
[ 
    { 
    path : '', 
    component: manageProductListComponent 
    }, 
    { 
    path : 'detail', 
    component: manageProdDetailComponent 
    } 
] 

そして、 、

import:[ routerModule.forChild(manageProdRoute)] 

目標:

ユーザータイプ/ url:port/manage-products =を行くためにリンクをクリックすると、ユーザーのタイプはurl:port/ =>それはurl:port/login/ にリダイレクトする場合は>それは、manageProductListComponent

問題

をロードしかし、ときます私はURL:portをロードして、ログインページに行く代わりに、manageProductListComponentをロードします。私がapp.routing.tsからmanage-productセクションをコメントアウトしても、それは同じように動作しますが、すべてのモジュールのすべての子どもたちについては、app.routing.tsで詳細に言及すれば、正しく動作します。

質問 私は、個々のrouting.ts内のすべてのモジュールベースのルーティングを維持し、彼らは順番にを働くようにapp.routing.tsでそれらをインポートするために必要?

答えて

0

次のサンプルコードを使用することができます - あなたは大丈夫です、問題

{ 
    path : '', 
    component: manageProductListComponent 
}, 
+0

を引き起こすmanageProductListComponentとして空pathmatchを与えている

[ { path: '', redirectTo: 'login', pathMatch: 'full'}, { path: 'login', children: [ { path: '', component: yourLoginComponent}, { path: 'dashboard', component: your-dashboardReportComponent}, ] }, { path: 'manage-products', children: [ { path: '', component: your-manageProdDetailComponent}, ] }, ]; 

を。私は – SamCodes

+0

をapp.routing.tsする設定を供給します管理-product.routing.tsすなわち、別のおすすめのモジュールのルーティングを維持したいのですが、 '{ パスというルーティング設定を指示するどのような方法があります:「」、 コンポーネントは、 :manageProductListComponent } 'は、 'manage-products'ルートパスの下の子ルートですか? – SamCodes

関連する問題