"undefined" instead of ID in URL on transition in Ember and Ember Data

I have a pretty standard post model with a title and a text field. I have two routes for the model -- new route and show route. I want to create a post from new route and then transition to show route.

This is my router file

this.route('post-new', { path: '/posts/new' });
this.route('post-show', { path: '/posts/:postId' });

and submit action in post-new controller is something like this.

actions: {
  submit() {
    const { title, text } = this.getProperties('title', 'text');
    let post = this.store.createRecord('post', {
      title: title,
      text: text
    });
    post.save().then(() => {
      //success
      this.transitionToRoute('post-show', post);
    }, () => {
      //error
    });
  }
}

So I am expecting this to redirect from http://localhost:4200/posts/new to something like http://localhost:4200/posts/23 (assuming 23 is id).
The save() is successful and record is created on the backend (which is rails) and I also see the post record updated in browser (it now has an ID) using Ember Inspector. But the redirection is happening to http://localhost:4200/posts/undefined.

How can I make this to redirect to something like http://localhost:4200/posts/23 after save ?

Btw, The versions are:
ember cli : 2.3.0-beta.1
ember : 2.3.0
ember data : 2.3.3