How to apply pipe to value in RouterLink?

问题

I have the following route in Angular 7:

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

The problem is with applying the pipe slugify within the routerlink.

How can I apply a pipe to a value inside routerLink?

回答1:

Try removing the curly brackets like this:

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

You don't need them there because you are using property binding which is already evaluating to TypeScript code.

回答2:

what about this

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

and in your constructor,

constructor(private slugifyPipe: SlugifyPipe) {
}

also you need to provide SlugifyPipe in your module providers

来源：https://stackoverflow.com/questions/56955248/how-to-apply-pipe-to-value-in-routerlink