我创建了一个组件,其中包含一个带有routerLink属性的元素,我想从使用该组件的模板中设置该属性.当我尝试这样做时,我收到错误消息’无法读取属性’未定义’的路径’.
我的组件看起来链接这个:
INFO-Box.component.ts
import { Input,Component } from "@angular/core"; import { ROUTER_DIRECTIVES } from "@angular/router"; @Component({ selector: "info-Box",template: require("./info-Box.component.html"),directives: [ ROUTER_DIRECTIVES ] }) export class InfoBoxComponent { @Input() routerLink: string; @Input() imageUrl: string; }
INFO-Box.component.html
<a [routerLink]="[routerLink]"> <img src="{{imageUrl}}" width="304" height="236"> </a>
并且使用组件的模板看起来像这样:
<info-Box [routerLink]="['/test']" [imageUrl]="['./testimage.jpg']"
如果我不添加routerLink一切正常.我的路由器配置似乎是正确的,因为当我直接添加到我的模板时,它也可以正常工作.谁能帮我这个?
Grt Marco
解决方法
你可以在html中使用这样的代码来动态创建url
例如,您在路由器中的路径是路径:’destination /:id’,那么您可以像这样使用routerLink
<div *ngFor = "let item of items"> <a routerLink = "/destination/{{item.id}}"></a> </div>
我希望我的回答有用