reload the route emberjs

Question

I have a profile route

 Remon.ProfileRoute=Ember.Route.extend({

    activate: function() {
    console.log("act");
  },

   model: function(params){
    return this.store.find("profile",params.profile_id);

 }
});

and here is my router.js

Remon.Router.map(function(){
 this.route("news");
  this.resource("profiles");
   this.resource("profile",{path:'profile/:profile_id'},function(){
 this.route("photos");
  });
 });

and my link-to helper

  {{#link-to "profile" 1}}another profile {{/link-to}}

when I visit a profile from profiles main page it work good and activate method also work but when I am on the profile page and tried to visit another profile url not changed but model data for the second profile are loaded from profiles main page when I click on a profile

Attempting transition to profile.index ember.js?body=1:3462
Transition #33: profile: calling beforeModel hook ember.js?body=1:3462
 Transition #33: profile: profile: resolving provided model ember.js?body=1:3462
  Transition #33: profile: calling afterModel hook ember.js?body=1:3462
 Transition #33: profile.index: calling beforeModel hook ember.js?body=1:3462
 Transition #33: profile.index: calling deserialize hook ember.js?body=1:3462
 Transition #33: profile.index: calling afterModel hook ember.js?body=1:3462
 Transition #33: Resolved all models on destination route; finalizing transition. ember.js?body=1:3462
  act            profile_route.js?body=1:3
  Transitioned into 'profile.index' ember.js?body=1:3462
  Transition #33: TRANSITION COMPLETE

when I click on another profile on the same profile page no transition to the new model occurred but the template changed to the new data but url keeps the previous one

 Transition #34: profile: profile: resolving provided model ember.js?body=1:3462
Transition #34: profile: calling afterModel hook ember.js?body=1:3462
Transition #34: profile.index: calling beforeModel hook ember.js?body=1:3462
Transition #34: profile.index: calling deserialize hook ember.js?body=1:3462
 Transition #34: profile.index: calling afterModel hook ember.js?body=1:3462
  Transition #34: Resolved all models on destination route; finalizing 

in console it stopped at

   Resolved all models on destination route; finalizing transition.

and "Transitioned into 'profile' not appeared and activate method not triggered too

update

I think I found where is the error I have multiple layouts

 Remon.MainLayoutView = Ember.View.extend({


didInsertElement  : function(){
    console.log("pr");
    this._super();

  this.$('#simple-menu').sidr({
      name: 'sidr-left',
      side: 'left',
      source: '#myside',
      renaming: false
  });
},
willAnimateIn : function () {

    this.$().css("opacity", 0);
},

animateIn : function (done) {
    this.$().fadeTo(500, 1, done);
},

animateOut : function (done) {
    this.$().fadeTo(500, 0, done);
},
layoutName: 'layouts/application' });

Remon.ProfileView=Remon.MainLayoutView.extend();

after I removed the animateout method ,it works now

Answer 1

According to the docs for activiate :

This hook is executed when the router enters the route. It is not executed when the model for the route changes.

Seems like beforeModel might be the best place to put that code, but I'm not sure what your intention is. What are you wanting to do?

That said, your URL should change when you change models within the profile page. What does your link-to look like there?

Here is an example project which has your router and properly changes the URL.

Full screen app (to see the url changing)

code on js bin

Update

I tried to get the library you referenced (Sidr) to work, but I'm unable to (in a reasonable amount of time). I'm getting Uncaught TypeError: Object [object Object] has no method 'sidr' in the console.

Here is the code .