app.module.ts
import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import {AppRoutingModule} from './app.router';
import {FormsModule} from '@angular/forms';
import {HttpModule} from '@angular/http';
import { AppComponent } from './app.component';
import { CartComponent } from './cart/cart.component';
import { DetailComponent } from './detail/detail.component';
import { IndexComponent } from './index/index.component';
import { ListComponent } from './list/list.component';
import { LoginComponent } from './login/login.component';
import { OrderConfirmComponent } from './orderConfirm/orderconfirm.component';
import { RegisterComponent } from './register/register.component';
import { UserCenterComponent } from './userCenter/usercenter.component';
import { HeaderComponent } from './utility/header/header.component';
import { FooterComponent } from './utility/footer/footer.component';
import { NotFoundComponent } from './utility/notFound/notfound.component';
@NgModule({
imports: [
AppRoutingModule,
FormsModule,
HttpModule,
BrowserModule
],
declarations: [
AppComponent,
CartComponent,
DetailComponent,
IndexComponent,
ListComponent,
LoginComponent,
OrderConfirmComponent,
RegisterComponent,
UserCenterComponent,
HeaderComponent,
FooterComponent,
NotFoundComponent
],
bootstrap: [ AppComponent ]
})
export class AppModule { }
app.router.ts
import { NgModule } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';
import { AppComponent } from './app.component';
import { IndexComponent } from './index/index.component';
const routes: Routes = [
{ path: '', component: IndexComponent },
{ path: 'index', component: IndexComponent },
];
@NgModule({
imports: [RouterModule.forRoot(routes)],
exports: [RouterModule],
})
export class AppRoutingModule { }
app.component.ts
import { Component } from '@angular/core';
@Component({
selector: 'my-app',
template: `
<router-outlet></router-outlet>
`,
})
export class AppComponent { name = 'Angular'; }