如何让 componentFactoryResolver 使用 RouterLink 创建锚点？答案

【问题标题】：How do I get the componentFactoryResolver to create an anchor with a RouterLink?如何让 componentFactoryResolver 使用 RouterLink 创建锚点？
【发布时间】：2019-08-20 04:08:23
【问题描述】：

我想在我的页面上动态添加一个锚标记。

到目前为止，我有这样的东西

const componentFactory = this.componentFactoryResolver.resolveComponentFactory(HTMLAnchorElement);

let cmpRef = this.container.createComponent(componentFactory);
cmpRef.instance.text = 'click here';
cmpRef.instance.routerlink = "/mylink"

但是，cmpRef.instance.routerLink 不存在，可能是因为 HTMLAnchorElement 是实际的 Html 锚标记，而不是具有 routerlink 输入的角度版本。

Angular 中 Angular 锚标签的组件名称是什么？

【问题讨论】：

标签： angular

【解决方案1】：

锚标签没有 Angular 组件。

如果你想自己实现它可能是这样的：

@Component({ 
  selector: 'router-link',
  template: `<a [routerLink]="routerLink">{{text}}</a>`
})
export class RouterLinkComponent {
  text: string;

  routerLink: string;
}

现在你可以像这样使用它：

const componentFactory = this.componentFactoryResolver.resolveComponentFactory(RouterLinkComponent);

let cmpRef = this.container.createComponent(componentFactory);
cmpRef.instance.text = 'click here';
cmpRef.instance.routerLink = '/about';

Ng-run Example

【讨论】：

该死，是的，这正是我所做的。我只是想有更好的方法来实现这一点。