CODEWITHSUNDEEP
ember.js
Rakesh
Rakesh

Reputation: 31

Add a parent route in ember for existing routes

Here is my problem, assume I am having an ember app with following ember route configuration:

Router.map(function() {
  this.route('todos', function() {
    this.route('new');
    this.route('view', {
      path: "/:id"
    });
  });
  this.route('articles', function() {
    this.route('view', {
      path: "/:id"
    });
    this.route('new');
  });
});

Now i want to add the add the prefix for each route based on some user information i would be fetching. For eg: Below are the two user information 

dev = {
 id: 1, 
 workspace: 'DEV'
}
qa = {
 id: 2,
 workspace:'TEST'
}

once the dev is landing in the app, route must be like: todos: 

/DEV/todos/new

and same for the other users. once the qa is landing in the page, route must be like:

/TEST/todos/new

to solve this i know we generate the parent route and add all the other route as child, need to change the file structure for this case.

Here is Ember :

ember-cli: 2.13.3,
ember-data: 2.18.5

Upvotes: 1

Views: 85

Answers (1)

Gokul Kathirvel
Gokul Kathirvel

Reputation: 1610

This is straight forward in Ember.js using the router's path as URL paths can be customized easily.

For your case, the todos route should have a dynamic segment (say, workplace) and hence, the router entry will be like:

Router.map(function() {
  this.route('todos', { path: '/:workplace/todos' }, function() {
    this.route('new');
    ...
  });
});

And if you are transitioning to new todo page using this.transitionTo('todos.new', 'TEST'), then URL will be updated as TEST/todos/new.

This twiddle has a tiny demo. Hope that helps :)

Upvotes: 2

Related Questions