угловой 2 попутный PARAMS в пути

Question

У меня есть компонент, из которого я должен передать данные другому компоненту по нажатию кнопки, так что я использовал [routerLink] свойство анкер, как этот

<a [routerLink]="['/employeedetail' , name, address, 
detail3 , detail4, detail5, detail6 , detail7, detail8 , 
detail9, detail10></a> 

определенного соответствующего маршрута в приложении. route.ts

{ 
    path: 'employeedetail/:name/:address/:detail3 /:detail4 
    /:detail5 /:detail6/:detail7 /:detail8 /:detail9 /:detail10 ', 
    component : employeedetailComponent 
    } 

В идеальном мире, он должен работать, но это не делает, как он дал ошибку говоря

zone.js:355Unhandled Promise rejection: Unsupported number of argument for pure functions: 11 ; Zone: ; Task: Promise.then ; Value: Error: Unsupported number of argument for pure functions: 11(…) Error: Unsupported number of argument for pure functions: 11

Я исследовал об этом и обнаружил, что маршрутизатор angular2 терпит неудачу, когда в встроенном шаблоне 10 элементов, я попытался удалить последний параметр в URL (detail10) и без ошибок.

Вопрос в том, как передать это большое количество параметров в url, используя [routerlink], или я должен использовать другой подход для передачи данных от одного компонента к другому компоненту?

Answer 1

Добавить метод компонента, который подготавливает маршрут и передать результат, а не строить его в шаблоне

class MyComponent { 
    get employeeDetailLink() { 
     return ['/employeedetail' , name, address, 
detail3 , detail4, detail5, detail6 , detail7, detail8 , 
detail9, detail10]; 
    } 
    } 

и использовать его как

<a [routerLink]="employeeDetailLink" 

Это ограничение было удалено в последнее время (не знаю, если он уже выпущен) https://github.com/angular/angular/pull/12710

См. также https://github.com/angular/angular/issues/12233

Answer 2

Вы можете использовать queryParams для передачи параметров в URL-адресе.

<a [routerLink]="['/employeedetail' , name, address]" [queryParams]="{detail3: detail3, detail4: detail4}">Somewhere</a> 

Использование параметров запроса лучше для необязательных параметров, что делает ваш URL более удобочитаемым.