angular - 如何将管道应用于RouterLink中的值？

Question

我在 Angular 7 中有以下路线：

<a [routerLink]="['/categories', {{ category.name | slugify }}, category.id]">{{category.name}}</a>

问题在于slugify在routerlink.

如何将管道应用于内部的值routerLink？

Answer 1

那这个呢

<a [routerLink]="['/categories', slugifyPipe.transform(category.name), category.id]">{{category.name}}</a>

在你的构造函数中，

constructor(private slugifyPipe: SlugifyPipe) {
}

您还需要SlugifyPipe在模块提供程序中提供

Answer 2

尝试像这样删除大括号：

<a [routerLink]="['/categories', category.name | slugify, category.id]">{{category.name}}</a>

您在那里不需要它们，因为您正在使用已经在评估 TypeScript 代码的属性绑定。

Answer 3

如果您尝试在字符串和变量上应用管道，您可以执行以下操作：

<button [routerLink]="['/thema' | routeT, category.id, category.catUrlParam | seoFriendlyFormat]">{{category.text}}</button>

routeT管道应用于“/thema”字符串，seoFriendlyFormat管道应用于“category.catUrlParam”变量。