routerLink 未使用 TS 模板语法编译

Question

我有这样的组件http://plnkr.co/edit/mJDHZIm5IzeMB9f2IVLE:

@Component({
  template: `
      <p [innerHTML]="link"></p>
  `,
  directives: [ROUTER_DIRECTIVES]
})
@RouteConfig([
  { path: '/two', component: Two, name: 'Two'},
])
export class App {
  two = (text: string) => `<a [routerLink]="['/Two']">${text}</a>`;
  constructor(private _router: Router) {  }
  ngOnInit() {
    this.link = `${this.two("two")}`;
  }
}

任何想法为什么它不编译 link 值或如何使其工作？目标是对 url 进行硬编码，并且只更改生成的链接的文本。

更新：

我也试过了：

two = (text: string) => `<a href="/two">${text}</a>`;

由于 HashLocationStrategy，它与 #/two 一起工作，但在我的应用程序中，路由器没有检测到链接并且整个页面重新加载...

Answer 1

routerLink 是一个指令。不会为使用innerHTML 添加的 HTML 创建指令和组件。

如果您将link 设为Array 而不是string。

这应该可以工作

<p [routerLink]="link"></p>

this.link = ['Two'];