Дети с угловым маршрутом на основе переменных сегментов

Helmut Granda спросил: 12 мая 2018 в 03:52 в: angular

У меня есть шаблон url в том же месте, но он заканчивается разными данными.

Пример:

Имейте в виду, что "детализация" и "объект" являются динамическими, Пример: detail1-category, detail2-category, detail3-category, object1, object2, objectt3.

URL1 = /url/detail-category

URL2 = /url/object

Мне нужно загрузитьChildren на основе того, заканчивается ли URL-адрес с "-категорией" или нет, я использую совпадение, но я теряю переменную "путь", так как совпадение и путь не могут использоваться на в то же время.

Оригинал:

{ path: 'url/:id',  
    loadChildren: './modules/child.module#ChildModule'
},

Обновлено:

{ matcher: categoriesMatcher, 
    loadChildren: './modules/child.module#ChildModule'
},export function categoriesMatcher(url: UrlSegment[]) {
    return url.length === 1 && url[0].path.endsWith('-category') ? ({consumed: url, path: url}) : null;
  }

// вышеприведенное отсюда , и он работает, но мы теряем данные, которые диктуют поведение компонента. Угловые 2 разных компонента с одним и тем же маршрутом

angular routes angular-routing

cgTag ответил: 12 мая 2018 в 04:14

Я не понимаю, что вы подразумеваете под переменной "path". Вы ссылаетесь на параметр :id в исходном примере? Эти параметры присваиваются posParam результата совпадения. Вот пример: gist.github.com/anein/fba647b4206695d109c30e1fc0d2e8ee

Helmut Granda ответил: 12 мая 2018 в 04:22

Да, вот что я имел в виду. Я был довольно близок, глядя на "снимок". Я собирался попытаться ввести его с помощью snapshot.paramMap ... Рад, что вы избили меня!

Helmut Granda ответил: 12 мая 2018 в 04:22

Можете ли вы задать свой комментарий в качестве ответа, чтобы я мог дать вам кредит?

1 ответ

Есть решение

cgTag ответил: 12 мая 2018 в 04:27

Матчи могут предоставлять параметры как часть логики соответствия. Возвращаемое значение должно содержать свойство posParam со значениями каждого параметра маршрута.

Например:

export function MyAwesomeMatcher ( url: UrlSegment[] ): UrlMatchResult {
    if (url.length === 0) {
        return null;
    }
    const reg = /^(awesome-path)$/;
    const param = url[ 0 ].toString();
    if (param.match( reg )) {
       // myValue: "awesome-path"
       return ({ consumed: url, posParams: { myValue: url[ 0 ] } });
   }
   return null;
}// define application routes.
const routes: Routes = [
   { path: '', component: HomeComponent, pathMatch: 'full' },
   { matcher: MyAwesomeMatcher, component: MyAwesomeComponent }
   ...
];

Код для примера выше скопировано здесь:

https://gist.github.com/anein/fba647b4206695d109c30e1fc0d2e8ee