Angular 来自数据库的 5 个通配符路由

Angular 5 Wildcard Routes from Database

我有一个来自数据库的类别列表,如下所示:

[
  "Travel",
  "Apparel & Clothing",
  "Footwear",
  "Kids & Children",
  "Grocery",
  "Food & Beverage",
  "Innerwear & Swimwear",
  "Hotels",
  "Bus Tickets",
  "Mobiles & Tablets",
  "Personalized Gifts",
  "Jewellery & Coins",
  "Car & Taxi Rental",
  "Pharmacy",
  "Watches",
  "Bags & Wallets",
  "Gifts & Flowers",
  "Accessories",
  "Games",
  "Health",
  "Beauty & Personal Care",
  "Electronics"
]

我正在尝试从此类别列表创建路线,我不确定如何处理列表中某些类别的路线。

例如:

Apparel & Clothing
Bus Tickets

如何处理 angular 5 路由系统中的 '&' 符号和 space ?

我找到了一个类似于助手的解决方案,我们在 Angular 5.

中有管道概念

它帮助了我:

https://github.com/angular/angular-cli

https://github.com/angular/angular-cli/wiki/generate-pipe

我的自定义管道删除 space 和特殊字符:

import { Pipe, PipeTransform } from '@angular/core';

@Pipe({
  name: 'removeSpaceCharacters'
})
export class RemoveSpaceCharactersPipe implements PipeTransform {
  transform(value: string): string {
    let newValue = value.replace(/[^A-Z0-9]/ig, "");
    return `${newValue}`;
  }
}