2016-03-05 68 views
0

以下代碼不會自動顯示列表,我必須創建一個鏈接並點擊。任何人都可以幫忙嗎?路由器 - 無法設置默認路由

謝謝

import { Component } from 'angular2/core'; 
import { HTTP_PROVIDERS } from 'angular2/http'; 
import { CourseListComponent } from '../lists/course.list'; 
import {RouteConfig, ROUTER_DIRECTIVES, ROUTER_PROVIDERS, LocationStrategy, HashLocationStrategy} from 'angular2/router'; 
import EndPointService from '../../Services/EndPointService'; 
import {CourseDetailsComponent} from '../course.details'; 


@Component({ 
    selector: 'course-router-app', 
    templateUrl: '/Admin/App/views/router/course-router-app.html', 
    directives: [ROUTER_DIRECTIVES], 
    providers: [ 
     HTTP_PROVIDERS, 
     ROUTER_PROVIDERS, 
     EndPointService 
    ] 
}) 
    @RouteConfig([ 
     { path: '/', name: 'Courses', component: CourseListComponent, useAsDefault: true }, 
     { path: '/details/:id', name: 'CourseDetails', component: CourseDetailsComponent } 
]) 
export default class CourseRouterComponent { 
} 

課程列表組件

import { Component, View, OnInit } from 'angular2/core'; 
import { NgFor } from 'angular2/common'; 
import EndPointService from '../../Services/EndPointService'; 
import LogService from '../../Services/LogService'; 
import * as dtos from '../../view-models/ICourseViewModel'; 
import {Router, RouteParams} from 'angular2/router'; 

@Component({ 
    selector: 'course-list', 
    providers: [EndPointService, LogService], 
    templateUrl: '/Admin/App/views/lists/course-list.html' 
}) 
export class CourseListComponent implements OnInit { 
    public courses: dtos.ISimpleCourseViewModel[]; 

    constructor(private _endPointService: EndPointService, private _router: Router, private _logService: LogService) { 

    } 


    showDetails(course: dtos.ISimpleCourseViewModel) { 
     this._logService.log('showing details ' + course.ID); 
     this._router.navigate(['CourseDetails', { id: course.ID }]); 
    } 

    ngOnInit(): any { 
     this._endPointService.getAllCoursesSimple().subscribe(
      (response) => { 
       this.courses = this.courses = response.json(); 
      }, 
      (err) => { 
       console.log(err); 
      }); 

    } 

    public diagnostic(): string { 
     return JSON.stringify(this.courses); 
    } 
} 

我也有<base href="/">集。

我沒有添加意見,因爲我不認爲它們很重要。誰能幫忙?我看不到我的代碼與呈現默認路由的在線示例有什麼不同。

+0

這個代碼看起來確定。你的'CourseListComponent'是什麼? – Sasxa

+0

您是否在index.html上添加了? –

+0

您必須在此處放置'CourseListComponent'代碼。 – micronyks

回答

2

作爲一個供參考我的工作解決此問題與下面的代碼 - 這是一個小黑客:

constructor(private _router: Router) { } 

    ngOnInit(): any { 
     this._router.navigate(['Courses']); 
    }