Angular 2 NgMdoule和延迟加载路由问题

我在我的应用程序中使用Angular2 Rc5，并且陷入了与NgModule的路由中。Angular 2 NgMdoule和延迟加载路由问题

我有一个模块在我的应用程序中称为产品模块（延迟加载模块），其中包含两个名为productListComponenent和ProductDetailComponenet的组件。我也有一个欢迎页面。

当我运行应用程序欢迎页面时，我可以导航到产品页面，点击任何产品后，我可以导航到产品详细信息页面。

我面临的问题是我无法直接导航到ProductDetail页面。例如我无法浏览此网址。

http://localhost:58248/products/1

我的路由代码如下。

app.routing.ts

import { Routes, RouterModule } from '@angular/router'; 

const appRoutes: Routes = [ 
    { path: '', redirectTo: 'home', pathMatch: 'full' }, 
    { path: 'products', loadChildren: 'app/products/product.module' } 
]; 

export const appRoutingproviders: any[] = []; 

export const routing = RouterModule.forRoot(appRoutes);

product.routing.ts

import { Routes, RouterModule } from '@angular/router'; 

import { ProductListComponent } from './product-list.component'; 
import { ProductDetailComponent } from './product-detail.component'; 



const appRoutes: Routes = [ 
    { path: '', component: ProductListComponent}, 
    { path: ':id', component: ProductDetailComponent }, 
    ]; 

export const routing = RouterModule.forChild(appRoutes);

，当我直接浏览详细网址它给了我一个错误。请参阅附件图片

。

来源

2016-08-22 Haseeb Khan

你是如何运行网络服务器？它是本地服务器，例如'lite-server'，还是由不同的系统提供服务。它看起来像是提供站点的任何东西都不会从根节点（即index.html）加载站点，所以它从不加载所需的JS文件。举另一个例子，我为我的项目使用'gulp-serve'（就在开发方面）。如果它不能识别路径，我必须在其配置中加入一个回退属性来加载'index.html'。这样做让网站在尝试导航到任何其他路径之前加载所有必需的JS。 –

我使用visual studio 2015并在IIS上托管应用程序。另外如果我直接浏览这个网址，它工作正常。 'http：// localhost：58248/products' 但我只面临与详细信息页面的问题。 –

路线似乎不正确。两个孩子都有相同的路线。你可以用代码的关键部分做一个笨重的部分，所以我们可以更仔细地看看它吗？ – DeborahK

如果您使用的是RC5，请确保您在基本标签中不使用斜杠。这是属于以前的RC版本

来源

2016-08-23 14:41:55

Angular 2 NgMdoule和延迟加载路由问题

回答

相关问题