格式routerLink PARAM网址
问题描述:
在我的角度2应用程序,我定义了诸如路由器链接:格式routerLink PARAM网址
<a *ngFor="let demo of demos" [routerLink]="['demo', demo.name]">example</a>
目前我正在demo.name为“example.net/demo/A%20%demo%20%测试”。我想将其格式设置为“example.net/demo/a-demo-test”以在浏览器地址栏中显示。
任何帮助,将不胜感激。
答
您可以使用routerLink
中的函数。所以,你可以在你的组件中使用函数:
hyphenateUrlParams(str:string){
return str.replace(' ', '-');
}
而在你routerLink
使用它:
[routerLink]="['/demo', hyphenateUrlParams(demo.name)]"
这提供了更多的重用性不是直接的routerLink
内变异变量。
答
创建一个将空格转换为连字符的管道。
@Pipe({
name: 'kebabCase'
})
export class KebabCasePipe implements PipeTransform {
transform(value: string): string {
return value.replace(' ', '-');
}
}
使用管道在链接:
<a *ngFor="let demo of demos" [routerLink]="['demo', demo.name | kebabCase]">example</a>
尝试与破折号代替空格。例如:'[routerLink] =“['demo',demo.name.replace(/ \ s +/g,' - ')]'' – Titus
@JaroslawK。我在每个模块中分别定义了路由。 –
@Titus我试过你的解决方案,这给了我错误“模板解析错误: 解析器错误:意外的令牌/在第35列”。 –