2016-08-29 11 views
0

Ich mache grundlegende Studenten-Anwendung, wo ich ein Problem, Routing zu verstehen.Routing in angular2 Typoskript (RC5)

app.modules.ts:

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

//import { InMemoryBackendService } from 'angular2-in-memory-web-api'; 
import { AppComponent } from './app.component'; 
import { routes }  from './app.routes'; 

import { StudentsComponent }  from './students.component'; 
//import { AddStudentComponent } from './add-student.component'; 
//import { StudentDetailComponent } from './student-detail.component'; 

import { StudentService } from './student.service'; 

@NgModule({ 
    imports: [ 
BrowserModule, 
FormsModule, 
routes, 
// HttpModule, 
// JsonpModule 
], 
declarations: [ 
AppComponent, 
StudentsComponent, 
// AddStudentComponent, 
// StudentDetailComponent 
], 
providers: [ 
StudentService, 
// { provide: XHRBackend, useClass: InMemoryBackendService }, 
], 
bootstrap: [ AppComponent ] 
}) 
export class AppModule { 
} 

app.routes.ts:

import { Routes, RouterModule } from '@angular/router'; 
import { ModuleWithProviders } from '@angular/core'; 
//import { AddStudentComponent } from './add-student.component'; 

import { StudentsComponent } from './students.component'; 
//import { StudentDetailComponent } from './student-detail.component'; 

const appRoutes: Routes = [ 
{ 
    path: '', 
    redirectTo: '/students', 
    pathMatch: 'full' 
}, 
{ 
    path: 'students', 
    component: StudentsComponent 
} 
// { 
// path: 'add', 
// component: AddStudentComponent 
// }, 
// { 
// path: 'update/:roll', 
// component: StudentDetailComponent 
// }, 

]; 

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

Ich verstehe nicht, was in Routing falsch ist, ist es nicht funktioniert. Ich versuche, die Schülerkomponente als Standardseite anzuzeigen.

+0

Was bedeutet "es funktioniert nicht"? –

+0

Welchen Server benutzen Sie? Hast du das '' als erstes Kind in deinem '' Tag? –

+0

Diese Zeile wird nach dem Kopf-Tag angegeben. – Hema

Antwort

1

Problem ist nicht mit dem Routing. Es gibt 2 Dinge, die ich geändert habe.

1) In app.modules.ts die folgenden Zeilen hinzugefügt werden sollen:

import { HttpModule, JsonpModule } from '@angular/http'; 

und

2) Bei der Einfuhr von app.modules.ts Kommentaren i gehalten, bevor HttpModule und JsonpModule müssen entfernt werden. d. h. Hinzufügen

HttpModule, 
JsonpModule 

im Import.

Vielen Dank, wer unterstützt.

0

Apache versucht, /students zu dienen, die offensichtlich nicht auf dem Server vorhanden ist. Apache kann nichts über eckige Routen wissen.

Es gibt (mindestens) zwei Möglichkeiten, dies zu nähern:

Server-Seite:
jede (nicht-Datei) Rewrite Anfragen an index.html wie here

Client-side:
Switch to HashLocationStrategy

@NgModule({ 
    providers: [{provide: LocationStrategy, useClass: HashLocationStrategy}] 
}) 
class AppModule {} 
+0

Danke. Aber ich möchte PathLocationStrategy verwenden. Kannst du mir dafür helfen? – Hema

Verwandte Themen