Angular 2 RC3路由问题 [英] Angular 2 rc3 routing issues

查看:40
本文介绍了Angular 2 RC3路由问题的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我认为我已按照说明进行操作,以便在rc3中正常工作.它在rc1中运行良好.我创建了app.routes和app.providers,它看起来像这样:

I think I have followed directions to get routing in rc3 working. It works well in rc1. I create the app.routes, the app.providers, and it looks like this:

main.ts:

import {bootstrap}    from '@angular/platform-browser-dynamic';
import {APP_ROUTER_PROVIDER} from './app.routes';
import {HTTP_PROVIDERS} from '@angular/http';
import {AppComponent} from './app.component';

bootstrap(AppComponent, [APP_ROUTER_PROVIDER, HTTP_PROVIDERS]); 

app.component.ts:

app.component.ts:

import {Component, OnInit} from '@angular/core';
import {ROUTER_DIRECTIVES, Router} from '@angular/router';
import { APP_PROVIDERS } from './app.providers';


@Component({
    selector: 'my-app',
    template: '<router-outlet></router-outlet>',
     directives: [ROUTER_DIRECTIVES],
    providers: [APP_PROVIDERS]
})
export class AppComponent implements OnInit { 
    constructor(private router: Router) {


    }
    ngOnInit() {
        this.router.navigate(['home']);
    }
}

app.providers.ts

app.providers.ts

import { bind } from '@angular/core';
import { HTTP_PROVIDERS } from '@angular/http';
import { FORM_PROVIDERS, LocationStrategy, HashLocationStrategy } from '@angular/common';
   
export const APP_PROVIDERS = [
    
    FORM_PROVIDERS,
    HTTP_PROVIDERS 
];

home.routes.ts

home.routes.ts

import {RouterConfig} from '@angular/router';
import {HomeComponent} from './home.component';

export const HomeRoutes: RouterConfig = [
    { path: 'home', component: HomeComponent, terminal: true }
];

home.component.ts

home.component.ts

import {Component} from '@angular/core';
import {ROUTER_DIRECTIVES, Router} from '@angular/router';

@Component({
    selector: 'kg-home',
    templateUrl: './home.component.html',
    directives: [ROUTER_DIRECTIVES]
})

export class HomeComponent {
    constructor(private router: Router) {
        console.log('in home component')
    }
}

但是当我运行它时,我得到:

but when I run it, I get:

任何帮助将不胜感激,我已经盯着这个东西两天了.

Any help would be appreciated, I have been staring at this stuff now for 2 days.

推荐答案

您需要默认路由

export const HomeRoutes: RouterConfig = [
    { path: '', redirectTo: '/home', terminal: true},
    { path: 'home', component: HomeComponent }
];

这篇关于Angular 2 RC3路由问题的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆