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

Question

我在 Angular 7 中有以下路线：

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

问题在于在 routerlink.

中应用管道 slugify

如何将管道应用于 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' 变量。