Same Ember.JS template for display/edit and creation -

i writing crud application using ember.js:

• a list of “actions” displayed;
• the user can click on 1 action display it, or click on button create new action.

i use same template displaying/editing existing model object , creating new one.

here router code use.

app = ember.application.create();  app.router.map(function() {     this.resource('actions', {path: "/actions"}, function() {         this.resource('action', {path: '/:action_id'});         this.route('new', {path: "/new"});     }); });  app.indexroute = ember.route.extend({     redirect: function() {         this.transitionto('actions');     }    });  app.actionsindexroute = ember.route.extend({     model: function () {         return app.action.find();     } });  app.actionroute = ember.route.extend({     events: {         submitsave: function () {             this.get("store").commit();         }     } });  app.actionsnewroute = ember.route.extend({     rendertemplate: function () {         this.render('action');     },      model: function() {         var action = this.get('store').createrecord(app.action);                return action;      },      events: {         submitsave: function () {             this.get("store").commit();         }     } }); 

the problem when first display action, , come create new one, looks template not using newly created record, use instead 1 displayed previously.

my interpretation controller , template not in sync. how that? maybe there simpler way achieve this?

here jsbin code: http://jsbin.com/owiwak/10/edit

by saying this.render('action'), not telling use action template, actioncontroller, when in fact want action template, actionnewcontroller.

you need override that:

this.render('action', {   controller: 'actions.new' }); 

updated js bin.