routerLink指令

Question

我正在编写一个Angular2应用程序，其中包含一些使用组件路由器的路由。

截至今天，我正在使用angular-2.0.0-beta.3。

在子组件中，我尝试使用routerlink指令和以下模板：

<a [routerLink]=['/Home']>Go Home</a>。

相反，呈现的内容是：

<a>Go Home</a>

没有任何异常抛出，将其作为无效锚点。

重要的是要注意router.navigate(['Home'])正在按预期工作。

app.component.ts：

@Component({
    selector: 'app',
    providers: [WrapperService],
    template: '<router-outlet></router-outlet>',
    directives: [ROUTER_DIRECTIVES]
})
   @RouteConfig([
    { path: '/home', as: 'Home', component: HomeComponent, useAsDefault: true }
])
export class AppComponent {
    constructor() { }
}

home.component.ts

@Component({
    selector: 'home',
    template: '<a [routerLink]="['/Home']">Go home</a>',
    directives: [ROUTER_DIRECTIVES]
})
export class HomeComponent {
    constructor() { }
}

实际上，这些文件只应显示当前页面的工作链接（为简单起见）。

这里缺少什么？

Answer 1

您正在使用的as语法不久前被弃用并重命名为name

以下是我定义路线的方法。

 @RouteConfig([
   new Route({ path: '/spreadsheet', component: Spreadsheet, name: 'Spreadsheet' })
 ])

<a [routerLink]="['/Spreadsheet']">Virtualized Spreadsheet</a>

此处有更多信息：http://www.syntaxsuccess.com/viewarticle/routing-in-angular-2.0

Answer 2

好吧，似乎我错过了 angular2-polyfills.js 依赖关系。 我不确定为什么需要它，但显然它会影响几个方面，其中就是链接的呈现方式。