我目前正在测试Angular Alpha 45,特别是路由,并通过使用参数实现路由来解决问题.我已经为一个特定实体的详细视图创建了一个组件.
@Component({
templateUrl: 'app/components/projekt/projekt.detail.html',
directives: [FORM_DIRECTIVES]
})
export class ProjektDetailComponent {
id: string;
constructor(params: RouteParams){
this.id = params.get('id');
}
}
Run Code Online (Sandbox Code Playgroud)
模板看起来像这样,只显示参数"id":
<h1>Projekt Details: {{id}}</h1>
RouteConfig如下所示:
@RouteConfig([
{ path: '/', component: StartComponent, as:'Start'} ,
{ path: '/projekte', component: ProjektOverviewComponent, as:'Projekte'},
{ path: '/projekte/:id', component: ProjektDetailComponent, as:'ProjektDetail'},
{ path: '/projekte/neu', component: NeuesProjektComponent, as:'ProjektNeu'}
])
Run Code Online (Sandbox Code Playgroud)
上面显示的Link和RouteConfig与角度文档中的示例类似.
<a [router-link]="['/ProjektDetail', {'id': '1'}]" class="btn btn-default">Details</a>
因此,当我导航到详细视图(例如127.0.0.1:8080/src/#/projekte/1)时,我收到以下错误,该错误显示在浏览器的控制台中(我已经使用Edge,Firefox 42进行了测试, Chrome 46):
EXCEPTION: Cannot resolve all parameters for ProjektDetailComponent(?). Make sure they all have valid type or …Run Code Online (Sandbox Code Playgroud)