Saya menulis aplikasi CRUD menggunakan Ember.JS:
- Daftar “tindakan” ditampilkan;
- Pengguna dapat mengklik satu tindakan untuk menampilkannya, atau mengklik tombol untuk membuat tindakan baru.
Saya ingin menggunakan template yang sama untuk menampilkan/mengedit objek model yang ada dan membuat yang baru.
Ini kode router yang saya gunakan.
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();
}
}
});
Masalahnya adalah ketika saya pertama kali menampilkan suatu tindakan, dan kemudian kembali untuk membuat tindakan baru, sepertinya templat tersebut tidak menggunakan rekaman yang baru dibuat, melainkan menggunakan rekaman yang ditampilkan sebelumnya.
Interpretasi saya adalah pengontrol dan templat tidak sinkron. Bagaimana Anda melakukan itu? Mungkin ada cara yang lebih sederhana untuk mencapai hal ini?
Berikut ini JSBin dengan kode: http://jsbin.com/owiwak/10/edit