Как использовать переменный маршрут с именованным роутером-розеткой? - PullRequest
Новая
       8

Как использовать переменный маршрут с именованным роутером-розеткой?

0 голосов
/ 28 августа 2018

У меня есть пара ключ-значение. Значение пары - это маршрут. Я использую названный роутер-выход . Я не могу найти правильный синтаксис для этого. Любая помощь приветствуется.

.ts: 

public myPair: { [key: string]: string } =
{
  'Keyvalue': 'MyRoutHere'
};

.html: 

<div *ngFor="let item of myPair | keyvalue">
    <button mat-raised-button type="submit" color="accent" [routerLink]="item.value">{{item.key}}</button>
</div>

<router-outlet name="namedRoute"></router-outlet>

module.routes.ts 

const routes: Routes = [{
    path: 'example', component: ExampleMainComponent, children: [
        { path: 'key-value', component: KeyValueComponent, outlet: 'namedRoute' }
    ]
}];

Вещи, которые я пробовал: 

'Keyvalue': '[\'/examples\', {outlets: {\'definition\': [\'key-value\']}}]'
'Keyvalue': '(definition:key-value)'
'Keyvalue': '\\key-value'

Ошибки, которые я получаю:

Сегмент URL: «examples /% 5B» / examples »,% 20% 7Boutlets:% 20% 7B« определение »:% 20% 5B'key-value '% 5D% 7D% 7D% 5D' Ошибка: не удается сопоставить ни один маршрут. Сегмент URL: «examples /% 5B» / examples »,% 20% 7Boutlets:% 20% 7B« определение »:% 20% 5B'key-value '% 5D% 7D% 7D% 5D'

* 1031 'примеры /% 28definition: ключ-значение% 29' *

Не может соответствовать ни одному маршруту. Сегмент URL: «examples / key-value»

1 Ответ

0 голосов
/ 28 августа 2018

не удалось прочитать ваш объект, измените свои ts и html на: 

  public myPair: { [key: string]: string } =
  {
    Keyvalue: 'MyRoutHere'
  };

HTML: 

    <div *ngFor="let item of myPair | keyvalue">
    <button mat-raised-button type="submit" color="accent" [routerLink]="item.value">{{item.key}}</button>
    </div>

    <router-outlet name="namedRoute"></router-outlet>
...