Массив RouterLink

У меня есть гиперссылка, которая мне нужна для создания маршрутизатора в Angular 4. У меня есть много частей URL-адреса, часть из которых представляет собой массив. Я не уверен, как заставить массив разбиться на части для массива routerlink.

Возьмем этот надуманный пример:

[routerLink]="['/customers', customerid, orderid, arrayofints, anotherint]"

Я бы хотел, чтобы роутер выглядел так, где customerid = 10, order = 500, arrayofints = [1,2,3], Anotherint = 888

"/customers/10/500/1/2/3/888"

Вместо этого я получаю что-то вроде этого:

"/customers/10/500;0=1;1=2;2=3/888"

angular routerlink
person Darthg8r    schedule 13.07.2017    source источник
comment
Что если разложить массив: orderid, ...arrayofints, anotherint? А, нет Parser Error: Unexpected token . at column   -  person jonrsharpe    schedule 14.07.2017
comment
@jonrsharpe Отрицательно, ошибка парсера: неожиданный токен. в столбце 36   -  person Darthg8r    schedule 14.07.2017
comment
что, если вы присоединитесь к arrayofints?   -  person Nick    schedule 14.07.2017
comment
Да, я пробовал это на Plunker. Затем просто создайте массив в компоненте, где вы можете распределить подмассив, и привяжите все это.   -  person jonrsharpe    schedule 14.07.2017
comment
Я пытался заменить arrayofints на 1/2/3, но в итоге он ускользает от /   -  person Darthg8r    schedule 14.07.2017
comment
Проблема заключается в том, что последняя часть URL-адреса добавляется в ngfor из списка вещей.   -  person Darthg8r    schedule 14.07.2017
comment
Затем сделайте функцию, которая возвращает массив — [routerLink]="createRouteWith(thing)". Я хочу сказать, что вы не так ограничены в том, какой синтаксис вы можете использовать в коде компонента.   -  person jonrsharpe    schedule 14.07.2017
comment
Итак, в основном это выравнивание списка, которое мы должны сделать в первую очередь.   -  person Rajan Chauhan    schedule 14.07.2017

Ответы (2)


arrow_upward
9
arrow_downward

Для чего-то нетривиального я бы выполнял работу в коде компонента, а не в шаблоне. Итак, в шаблоне:

[routerLink]="customerRouteFor(anotherint)"

и в компоненте, где вы можете использовать синтаксис ...spread:

customerRouteFor(anotherint: number): (string | number)[] {
  return ['/customers', this.customerid, this.orderid, ...this.arrayofints, anotherint];
}

На мой взгляд, это кажется более чистым, чем подход concat.

person jonrsharpe    schedule 13.07.2017
comment
Я думаю, что возвращаемый тип должен быть пересечением, а не объединением. Расширенные типы Typescriptссылка: ›Тип объединения описывает значение, которое может быть одним из нескольких типов. Мы используем вертикальную черту (|) для разделения каждого типа, поэтому номер | строка | boolean — это тип значения, которое может быть числом, строкой или логическим значением. Ясно, что этот массив всегда будет строкой и числом, а не одним из них. - person A. Alencar; 17.10.2018
comment
@A.Alencar A.Alencar, вещи в массиве представляют собой либо строки , либо числа, вы не можете обрабатывать их одновременно, как это подразумевает string & number. См. typescriptlang.org/docs/handbook/advanced-types.html. . - person jonrsharpe; 17.10.2018
comment
Я понимаю. Спасибо за разъяснения! Я думал, что возвращаемый массив состоит из строки И чисел, но дело в том, что каждое значение определяется как число или строка, поэтому массив также имеет тип числа или строки. - person A. Alencar; 17.10.2018

arrow_upward
3
arrow_downward

Сведение аргументов даст вам правильный URL

[routerLink]="[].concat.apply([],['/customers', customerid, orderid, arrayofints, anotherint])"
person Rajan Chauhan    schedule 13.07.2017