Angular 2 Rc.1路由器不加载“/”组件

我试图从rc.0版本使用新路由器（实际上使用rc.1）但是我无法获得加载“欢迎“组件。Angular 2 Rc.1路由器不加载“/”组件

这里是app.component.ts

import { Component } from '@angular/core'; 
import { Routes, ROUTER_DIRECTIVES} from '@angular/router'; 
import { HeaderComponent } from './common/header.component'; 
import { WelcomeComponent } from './common/welcome.component'; 
import { FooterComponent } from './common/footer.component'; 

@Component({ 
    selector: 'my-app', 
    template: ` 
    <header-component> </header-component> 
     <router-outlet> </router-outlet> 
    <footer-component> <footer-component> 
    `, 
    directives: [ROUTER_DIRECTIVES, HeaderComponent, WelcomeComponent, FooterComponent] 
}) 

@Routes([ 
    {path: "/", component: WelcomeComponent} 
]) 

export class AppComponent { 


}

这里是main.ts

import { bootstrap } from '@angular/platform-browser-dynamic'; 
import {ROUTER_PROVIDERS} from '@angular/router'; 
import { AppComponent } from './app.component'; 

bootstrap(AppComponent, [ROUTER_PROVIDERS]);

我不知道我失踪，路径为/应工作。index.html的基准ref也设置为“/”。我一直在使用diggi通过信息来源查看我缺少的东西但没有找到任何东西。

来源

2016-05-04 Mitchell Hamann

这是一个已知的问题https://github.com/angular/angular/issues/8409

如果你有路线设置没有任何路由器链接，你不注入路由器，不发生初始导航。

因此，无论您是注入Router还是添加<a [routerLink]="...">，直到解决此问题。

来源

2016-05-05 13:53:39

请详细说明这一行'所以要么注入路由器'我不在哪里应该注入路由器 –

@RavinderPayal你注入它的构造函数。以一个例子来看我的答案。 –

现在好了，那不是太明显 –

看起来像AppComponent构造需要这样的：

export class AppComponent { 

    constructor(private _router:Router){ 

    } 

}

不知道为什么，如果任何人有一个答案？

来源

2016-05-04 21:07:02

你仍然需要用注入它：

constructor(private _router:Router) { }

这就是所谓的依赖注入，也被称为构造函数注入。你的课程取决于路由器。在代码的顶部，您声明了Angular可以通过import语句找到依赖关系。您仍然需要实例化（注入）服务，然后才能使用它。这就是你在构造函数中声明的内容。有关依赖性注入

更多信息here

来源

2016-05-05 00:20:29 Patrick2607

的原因是因为Router从来没有真正得到您的示例中实例化。发生这种情况是因为RouterOutlet指令现在不依赖于Router服务。

当Router被实例化时，这就是它观察初始URL并激活初始路由的地方。

暂时的修复方法是通过手动注入Router来强制实例化路由器。或者 - 如果您碰巧在模板中有routerLink s，它将自动发生，如routerLink确实取决于Router。

来源

2016-05-05 13:41:01

Angular 2 Rc.1路由器不加载“/”组件

回答

相关问题