Angular 2 Router: several route parameters

I want to have a route with this URL

/collections/:collectionId/books/:bookId/:title

eg.

/collections/10/books/456678/my-book.html

in the app-routing.module.ts file

{path: 'collections/:collectionId/books/:bookId/:title', component: BookDetailsComponent},

Is it possible to use without nested routers?

I tried

this.router.navigate(['/collections',{collectionId: 10, bookId: 456678, title: "my-book.html"}]);

but got an error for example

Cannot match any routes. URL Segment: 'collections;collectionId=10;bookId=456678;title=my-book.html'

if I pass paramaters as an array,

this.router.navigate(['/collections', 10, 456678, "my-book.html"]);

I get

Error: Cannot match any routes. URL Segment: 'collections/10/456678/my-book.html

I managed to achieve what I wanted using the "children's" route "books" along the "collection" route, but I would like to do this without nested routes.

thank

+4
source share
1 answer

It should be

this.router.navigate(['/collections', '10', 'books', '456678', "my-book.html"]);

Quotes around numbers are not needed, but I think this is good practice.

+11
source

Source: https://habr.com/ru/post/1663067/


All Articles