CODEWITHSUNDEEP
ember.jsember-data
sentinel21
sentinel21

Reputation: 546

Ember.js data transition after version upgrade

So I'm writing a POC app, and I am running into an issue after upgrading my Ember library to RC1. I noticed that when I was transitioning to a route in the new version, a stringified version of the object appears to show up in the URL, like so...

http://localhost:3000/posts/<App.Post:ember269:511401b8c589137c34000001>

The routes work successfully when transitioned to like this, but obviously trying to visit a URL like that a second time won't work. So I figured I would edit my code to transition to the ID instead.

For my edit route, I have the following save event. 

  events: {
    save: function(post){
      post.one('didUpdate', this, function(){
        this.transitionTo('posts.show', post);
      });
      post.get('transaction').commit();
    }
  }

This produces a URL like the above when the transition happens. So I corrected it to the following...

  events: {
    save: function(post){
      post.one('didUpdate', this, function(){
        this.transitionTo('posts.show', post.id);
      });
      post.get('transaction').commit();
    }
  }

This produces the correct URL format, but the show route doesn't produce any output. (note that show output DOES produce output when I visit the URL for the first time with a correct format, just not when I transition to it from the edit route).

App.PostsShowRoute = Em.Route.extend({
  model: function(params){
    return App.Post.find(params.id);
  },
  setupController: function(controller, model){
    controller.set('content', model);
  }
});

So I'm confused. Any insight into the cause of this problem (and if you know why the RC produces it) would be much appreciated. Help me have my cake and eat it, too. Thanks!

Upvotes: 2

Views: 749

Answers (1)

Teddy Zeenny
Teddy Zeenny

Reputation: 3971

From your App.PostsShowRoute I can guess that you set up your route mapping like this:

App.Router.map(function() {
  this.resource('posts', function() {
   this.route('show', { path:'/:id' });
  });
});

You need change :id to :post_id:

App.Router.map(function() {
 this.resource('posts', function() {
   this.route('show', { path:'/:post_id' });
 });

});

Now, since you are using Ember conventions, you can take advantage of that by deleting the whole App.PostsShowRoute = Em.Route.extend ... because Ember can take care of it for you.

And use your first method which was correct:

events: {
  save: function(post){
    post.one('didUpdate', this, function(){
      this.transitionTo('posts.show', post);
    });
    post.get('transaction').commit();
  }
}

Upvotes: 3

Related Questions