Need clear idea about Redirecting

1

Hi,

I have tried one example: http://jsbin.com/IDakAtE/1/edit

I have following questions:

1. First i am redirecting to students from project using beforeModel hook. Then redirecting from students to student using afterModel hook. My problem is when i click "Get Projects" link in the application template (that links to project template) nothing happening and no error message.

Note: Removing either afterModel or beforeModel hook is working i.e, multiple redirects not working

What i am doing wrong here?

2. Let say i have one redirect from project to students using beforeModel hook in project route. When i clicks "Get Projects" link to show project template that redirects to students correctly first time. If i click "Get Projects" again is not working (nothing happening).

3. Let say i dont have any redirects. My aim is to display project->students     
   ->1st student when clicks "Get Projects" link in application template. So i  
   used the following line:
           {{#link-to 'students.student' 1}}Get Projects{{/link-to}} 
   in application template.

   Its working fine. My question is instead of passing id explicitly, is there 
   any other way to achieve this without specifying particular id as 1 since 
   client not aware of ids of dynamic loaded data from server.

Kindly assist me in this.

2

@susai, I have made some changes to your bin to work here.

Answers to your questions:

First i am redirecting to students from project using beforeModel hook. Then redirecting from students to student using afterModel hook. My problem is when i click "Get Projects" link in the application template (that links to project template) nothing happening and no error message. 

Note: Removing either afterModel or beforeModel hook is working i.e, multiple redirects not working

What i am doing wrong here?

In the beforeModel hook of project route, you are redirecting to students route, which is a child of project. Since transitioning to project is not completed, when you transition to students route, the router will try transition to project.students. But in project route, there is a transitionTo another route, which causes infinite transition to project route.

To overcome this, check if the transition’s targetName is project.index and then redirect, so that

  • when you click Get Projects, you will be transitioned to project.index - redirect from here
  • transitioning to project.students - route won’t again fire this redirection.

Let say i have one redirect from project to students using beforeModel hook in project route. When i clicks “Get Projects” link to show project template that redirects to students correctly first time. If i click “Get Projects” again is not working (nothing happening).

When you are inside a child route, and transition to the parent route, the router will transition to the index of the parent route, and the beforeModel, model, afterModel hooks of the parent route won’t be fired., in these scenarios. So only when you are inside the project.students.student route, and transition to project route, you will be taken to project.index route, and the beforeModel, model, afterModel hooks of project route won’t be fired, and redirections won’t happen.

Let say i dont have any redirects. My aim is to display project->students     
   ->1st student when clicks "Get Projects" link in application template. So i  
   used the following line:
           {{#link-to 'students.student' 1}}Get Projects{{/link-to}} 
   in application template.

   Its working fine. My question is instead of passing id explicitly, is there 
   any other way to achieve this without specifying particular id as 1 since 
   client not aware of ids of dynamic loaded data from server.

No you shouldn’t do in this way, if you follow the approach in the bin, you won’t need to do like this.

Hope your questions are answered.

One small suggestion, the version of Ember in your example is tool old, maybe you are using the bin form getting started page, to start with the latest version of ember, handlebars and jquery, you can start from a bin from emberjs.jsbin.com.

2 Likes
3

@hyder Cool Answer buddy

Still instead of checking transition.targetName === project.index, you can make the redirection from the project.index routes. Each nested resource will be gifted with an index route

 App.ProjectIndexRoute = Em.Route.extend({
  beforeModel:function(transition){
     this.transitionTo('students');
  }  
});

That would be still better.

Reason: The beforeModel of the project resource will be invoked for projects.index, projects.students and projects.students.student and the if check (transition.targetName === project.index) will be executed thrice.

The repetition of if checks might be eliminated if redirection is made from index route

Working jsbin

PS This also solves your second question

2 Likes