[英]Unexpected value XXXX imported by the module 'AppModule' in angular2
Im trying to make a router in Angular2, I created an app.routing.ts
file, which look like that : 我试图在Angular2中制作路由器,我创建了一个
app.routing.ts
文件,如下所示:
import {NgModule} from '@angular/core';
import {Routes, RouterModule} from '@angular/router';
import { NewNoteComponent } from './components/new-note.component';
import { NoteListComponent } from './components/note-list.component';
const routes: Routes =[
{path: '', pathMatch: '', redirectTo: 'note-list'},
{path: 'note-list', component: NoteListComponent},
{path: 'new-note', component: NewNoteComponent}
];
NgModule({
imports: [RouterModule.forRoot(routes)],
exports: [RouterModule]
})
export class AppRoutingModule{}
export const routingComponents = [NewNoteComponent, NoteListComponent];
and set my app.module.ts
like that : 像这样设置我的
app.module.ts
:
import { NgModule } from '@angular/core';
import {HttpModule} from '@angular/http';
import { BrowserModule } from '@angular/platform-browser';
import {FormsModule} from '@angular/forms';
import { AppComponent } from './app.component';
import {AppRoutingModule, routingComponents} from './app.routing';
import { SearchComponent} from './components/search.component';
@NgModule({
imports: [ BrowserModule , FormsModule, AppRoutingModule, HttpModule],
declarations: [ AppComponent, SearchComponent, NoteListComponent],
bootstrap: [ AppComponent ]
})
export class AppModule { }
My problem is that when I try to run this thing, it's throw me a weird error thats saying that Unexpected value 'AppRoutingModule' imported by the module 'AppModule'
我的问题是,当我尝试运行该程序时,抛出了一个奇怪的错误
Unexpected value 'AppRoutingModule' imported by the module 'AppModule'
That's suppose to be real easy but I really working my mind around what stupid mistake I just did . 假设这确实很容易,但是我确实在思考我刚才所做的愚蠢错误。
You are missing @
inside your AppRoutingModule
before NgModule
. 您在
AppRoutingModule
之前的NgModule
中缺少@
。
import {NgModule} from '@angular/core';
import {Routes, RouterModule} from '@angular/router';
import { NewNoteComponent } from './components/new-note.component';
import { NoteListComponent } from './components/note-list.component';
const routes: Routes =[
{path: '', pathMatch: '', redirectTo: 'note-list'},
{path: 'note-list', component: NoteListComponent},
{path: 'new-note', component: NewNoteComponent}
];
@NgModule({
imports: [RouterModule.forRoot(routes)],
exports: [RouterModule]
})
export class AppRoutingModule{}
export const routingComponents = [NewNoteComponent, NoteListComponent];
And you should use routingComponents
in your AppModule
declarations
: 并且您应该在
AppModule
declarations
使用routingComponents
:
@NgModule({
imports: [ BrowserModule , FormsModule, AppRoutingModule, HttpModule],
declarations: [ AppComponent, SearchComponent, routingComponents],
bootstrap: [ AppComponent ]
})
export class AppModule { }
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.