我正在教自己Angular2和我正在看的文字说：
The router locates or creates an instance of the component associated with the route,and that component’s view is displayed in the location defined by the RouterOutlet directive.
代码示例：
import { Component } from 'angular2/core';
import {ProductListComponent} from './products/product-list.component';
import {ProductService} from './products/product.service';
import {HTTP_PROVIDERS} from 'angular2/http';
import {ROUTER_PROVIDERS,RouteConfig,ROUTER_DIRECTIVES} from 'angular2/router';
import 'rxjs/Rx'; //Load all features
import {WelcomeComponent} from './home/welcome.component'
@Component({
selector: 'pm-app',template:`
<div>
<nav class='navbar navbar-default'>
<div class='container-fluid'>
<a class='navbar-brand'>{{pageTitle}}</a>
<ul class='nav navbar-nav'>
<li><a [routerLink]="['Welcome']">Home</a></li>
<li><a [routerLink]="['Products']">Product List</a></li>
</ul>
</div>
</nav>
<div class='container'>
<router-outlet></router-outlet>
</div>
</div>`,directives: [ROUTER_DIRECTIVES],providers: [ProductService,HTTP_PROVIDERS,ROUTER_PROVIDERS]
})
@RouteConfig([
{path: '/welcome',name: 'Welcome',component: WelcomeComponent,useAsDefault: true },{path: '/products',name: 'Products',component: ProductListComponent}
])
export class AppComponent {
pageTitle: string = "Acme Product Management";
}
问题是：我可以看到定位部分,但它是什么意思,它创建了一个相关组件的实例？它只是{},如果是,那么在关联的RouterOutlet指令中会显示什么？
解决方法
您有RouteConfig注释,它包含两个配置对象：
{path: '/welcome',component: ProductListComponent}
例如,该对象中的每个对象都有自己的路径/ welcome和关联组件WelcomeComponent.
如果你要去/欢迎位置,与此路径组件关联的角度放置 – 欢迎组件位于< router-outlet>< / router-outlet>的地方指令包含在html中.
结果我们在某个特定的地方用自己的html和逻辑注入了Component.
