CODEWITHSUNDEEP
javascriptember.jsroutes
VoY
VoY

Reputation: 5699

Can I transitionTo a route in Ember.js application without models available?

I am implementing a calendar application in Ember. I have my router set up this way:

App.Router.map(function() {
    this.resource('month', { path: '/month/:year/:month' });
});

Now I would like to have buttons to navigate to the next or previous month. At that point I don't have the model for the next/previous month loaded, I only know what month and year I want to go to, so I'd expect being able to transition like this:

this.transitionTo('month', { year: 2014, month: 1 });

However, Ember will expect my parameter to be a model, will skip the Route#model hook on month route and directly set the provided object to the controller in Route#setupController.

I think my scenario is rather common and from my Googling it seems like it used to be supported, but it just does not work for me. Please, advice how I can transition to a route when all I know are the ids of the models involved and don't have access to the actual model instances.

Upvotes: 2

Views: 1064

Answers (1)

Kingpin2k
Kingpin2k

Reputation: 47367

Since your route is a composite key, you're having to send in an object. Ember considers an object to be the model for the route. If you were to just send in a non object, or an id Ember would then hit the model hook and do what you are expecting.

So you're going to have to handle it in the setupController, here's the general idea

this.transitionTo('month', { year: 2014, month: 1, needsGetting: true });

App.IndexRoute = Ember.Route.extend({
  model: function() {
    return ['red', 'yellow', 'blue'];
  },
  setupControler: function(controller, model){
    if(Em.get(model, needsGetting)){
       // model = get the model
    }
    this._super(controller, model);
  }
});

As mentioned in my comment you could also use the model hook

App.IndexRoute = Ember.Route.extend({
  model: function() {
    return ['red', 'yellow', 'blue'];
  },
  setupControler: function(controller, model){
    if(Em.get(model, needsGetting)){
       //model = this.model(model);
       // model = get the model
    }
    this._super(controller, model);
  }
});

Or you can fetch the next model

App.IndexRoute = Ember.Route.extend({
  model: function() {
    return ['red', 'yellow', 'blue'];
  },
  actions : {
    previous: function(){

    },
    next: function(){
      var model = this.get('currentModel');
      //figure out next hash
      var nextModel = this.model(nextModelParams);
      this.transitionTo('month', nextModel);
    }     
  }
});

Upvotes: 2

Related Questions