2016-03-05 139 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']); 
    }