导入不起作用时的路由

时间:2017-01-15 03:42:19

标签: javascript angular typescript angular-ui-router angularjs-routing

我目前正在尝试将路由添加到我的Angular 2项目中。所有组件都有效,但是当我添加“appRoutes”时到我在app.module.ts上的导入时,会抛出一个错误

  

未捕获的TypeError:无法设置属性' stack'未定义的

这是我的代码:

app.module.ts

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { FormsModule } from '@angular/forms';
import { HttpModule } from '@angular/http';

import { appRoutes } from './app.router';
import { AppComponent } from './app.component';
import { NavigationComponent } from './navigation/navigation.component';
import { AboutComponent } from './about/about.component';
import { ResumeComponent } from './resume/resume.component';
import { WorkComponent } from './work/work.component';
import { BlogComponent } from './blog/blog.component';
import { HomeComponent } from './home/home.component';



@NgModule({     
declarations: [
AppComponent,
NavigationComponent,
AboutComponent,
ResumeComponent,
WorkComponent,
BlogComponent,
HomeComponent
],
imports: [
appRoutes,
BrowserModule,
FormsModule,
HttpModule
],
providers: [],
bootstrap: [AppComponent, NavigationComponent, AboutComponent,
            ResumeComponent, WorkComponent, BlogComponent, HomeComponent]
})
export class AppModule { }

app.router.ts

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

import { AppComponent } from './app.component';
import { AboutComponent } from './about/about.component';
import { ResumeComponent } from './resume/resume.component';
import { WorkComponent } from './work/work.component';
import { BlogComponent } from './blog/blog.component';
import { HomeComponent } from './home/home.component';

export const appRoutes: Routes =[
  { path: '', redirectTo: 'home', pathMatch: 'full' },
  { path: 'about', component: AboutComponent },
  { path: 'resume', component: ResumeComponent },
  { path: 'work', component: WorkComponent },
  { path: 'blog', component: BlogComponent },
  { path: 'home', component: HomeComponent }
];

export const routes: ModuleWithProviders = RouterModule.forRoot(appRoutes);

任何帮助将不胜感激。该页面有效,直到我添加appRoutes导入,然后它就位于加载...

2 个答案:

答案 0 :(得分:0)

您不应该需要ModuleWithProviders。从以下位置删除:

export const routes: ModuleWithProviders = RouterModule.forRoot(appRoutes);

即。

export const routes: RouterModule.forRoot(appRoutes); 

看看它是否有效。 (也可以通过删除导入来清理。)

答案 1 :(得分:0)

我能够找到解决自己问题的方法。我从引导程序中删除了每个组件:[...]除了AppComponent之外,还保留了声明中的其他组件并修复了问题。