Angular 2 RC1 组件路由不加载任何东西答案

【问题标题】：Angular 2 RC1 component routing doesn't load anythingAngular 2 RC1 组件路由不加载任何东西
【发布时间】：2016-10-04 07:08:38
【问题描述】：

我正在使用 Angular 2.0.0-rc.1。我尝试使用一条路由开始设置路由，但没有显示任何内容。没有抛出任何错误。

Main.ts

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

bootstrap(AppComponent, [
  ROUTER_PROVIDERS
]);

app.component.ts

import { Component } from '@angular/core';
import { MyComponent} from './my/my.component';
import { HTTP_PROVIDERS } from '@angular/http';
import { ROUTER_DIRECTIVES, Routes } from '@angular/router';
import 'rxjs/Rx';

@Component({
  selector: 'my-app',
  templateUrl: 'app/app.component.html',
  directives: [MyComponent, ROUTER_DIRECTIVES],
  providers: [HTTP_PROVIDERS]
})

@Routes([
  { path: '/', component: MyComponent }
])

export class AppComponent { }

app.component.html

<div>
    <router-outlet></router-outlet>
</div>

index.html 以

开头

<html>
<head>
  <base href="/">

我的组件

import { Component } from '@angular/core';

@Component({
    selector: 'pr-my',
    templateUrl: 'app/my/my.component.html'
})

export class MyComponent {
}

更新：如果我将 routerLink 添加到 app.component.html 并单击它，则内容会按预期加载。不点击链接就不会加载。

<a [routerLink]="['/']">Home</a>

【问题讨论】：

控制台有错误吗？
指令中的MyComponent是多余的
@micronyks - 控制台中没有错误
routerLink 是我回答中提到的另一种解决方法。

标签： angular angularjs-routing

【解决方案1】：

你需要注入路由器

class AppComponent {
  constructor(router:Router){}
}

这是一个已知问题。

【讨论】：

很高兴它有帮助。如果 AppComponent 中有 routerLink，则无需注入路由器。我只是发现注入路由器不如添加 routerLink 然后使其不可见（如果我实际上不需要它）。你现在最好还是坚持使用 router-deprecated 。他们现在再次重新考虑如何在路由器故事中向前推进。