Angular 2路由器组件在进行交互之前不会初始化

Question

加载路径时，将呈现其模板的所有静态内容。但是，在第一次交互之前，所有具有绑定的元素都会被隐藏。

将项目简化为最简单的我有这个：

app.component.ts

import { Component } from '@angular/core';
import { RouteConfig, ROUTER_DIRECTIVES } from '@angular/router-deprecated';

import { DashboardComponent } from './dashboard/';
import { PagesComponent } from './pages/';

@Component({
    selector: 'admin-app',
    templateUrl: 'admin.component.html',
    directives: [ROUTER_DIRECTIVES]
})
@RouteConfig([
    { path: '/', name: 'Dashboard', component: DashboardComponent },
    { path: '/pages', name: 'Pages', component: PagesComponent },
])
export class AdminAppComponent {
    test = 'Binding from main component';
    constructor() {
    }
}

app.component.html

<p>
  {{test}}
</p>
<a [routerLink]="['Dashboard']">Dashboard</a>
<a [routerLink]="['Pages']">Pages</a>
<router-outlet> </router-outlet>

pages.component.ts

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

@Component({
    moduleId: module.id,
    selector: 'go-pages',
    templateUrl: 'pages.component.html',
    styleUrls: ['pages.component.css']
})
export class PagesComponent {
    test = 'YES';
    constructor() { }
}

pages.component.html

<p>
  pages works!
</p>
<p>
  Bindings work -> {{test}}
</p>

如果我在浏览器中转到http://localhost:4200/pages，会发生以下情况：

• <p>{{test}}</p>始终呈现，因为＆＃39;从主要组件绑定＆＃39;
• <p>pages works!</p>也一直呈现。
• <p>Bindings work -> {{test}}</p>有时会在开始时呈现，但大部分时间我必须再次点击<a>Pages</a>，然后它始终显示

我使用的是角度和路由器弃用的2.0.0-rc.1。