Create Angular Dynamic Route

Question

I have a route string like the following var global_book_route = /books/:id specified in a variable.

I want to be able to use $route or $location to deep link to this route in a controller, is there a way to do this without re-specifying the url prefix?

This would work: var id=1; $location.path('books/'+id') -> '/books/1'

However, this does not: $location.path(global_book_route).search({id:1}) -> 'books/:id?id=1'

Is there a way I can use the route specified in the string to go to the correct location?

I'm think I'm a little fuzzy on the end goal here. Why isn't $location.path('books/' + id) adequate? The use of variables in routes are for accessing them in the request (the part that happens after $location) — azium
– azium, Commented Jun 10, 2015 at 19:07
@azium with complicated URLs, it is a pain to recreate and respecify the route logic using string addition. Using a contrived example, 'users/:userId/accounts/:accountId' - $location.path('users/'+user.id+'/accounts/'+account.id) - what if the account route changes to 'users/:userId/:accountId' ? — tmarthal
– tmarthal, Commented Jun 10, 2015 at 19:20
When you mean "route logic", are you saying the string that represent the url? If the underlying route changes, there's pretty much nothing you can do but to make sure you change your url. It's like if google maps api changes from /_api/v2/ to /_api/v3/, you have to change your code to reflect that. — azium
– azium, Commented Jun 10, 2015 at 19:25
To avoid string addition you could always write a little helper function like: buildUserUrl(user.id, account.id) which would result in 'users/1/accounts/2' — azium
– azium, Commented Jun 10, 2015 at 19:26

Jeremy · Accepted Answer · 2015-06-10 19:07:23Z

1

I think you are mixing up the route itself (/books/:id) with the representation of the route in your code.

For example, your global_book_route should be only "/books/".

Then, if you want to load a specific book, you can go the the location global_book_route + book_id as long as the route is declared in your code, like:

 $routeProvider
   .when('/Book/:bookId', {
    templateUrl: 'book.html',
    controller: 'BookController',
    resolve: {        
    }
  })

On a side node, when dealing with routes in Angular, it's really worth it to look into angular-ui, the ui-router offers a way better system to manage your routes and states.

answered Jun 10, 2015 at 19:07

Jeremy

3511 silver badge3 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

tmarthal Over a year ago

Right, so how would you deep link to that route without re-specifying the 'Book/' prefix? That is actually my question. How would you specify that route in a controller or view? I assume the current practice is what I mentioned, just have the route string re-specified in the controllers without the routeParams (e.g. 'Book/'+id)

Jeremy Over a year ago

You could use something like a global constant if you want to make code refactoring easier in the long term. plnkr.co/edit/VIO46fn8ZaEaTsC3OBnu?p=preview

Collectives™ on Stack Overflow

Create Angular Dynamic Route

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related