在创建/更新操作后使用Ember中的响应更新模板
我正在使用ember js制作一个简单的CRUD应用程序。我有一个输入表单的模板,它将数据发送到服务器,服务器响应成功响应。输入表单数据:“user”:{“id”:1,“name”:“John”};
服务器响应:{“message”:“创建成功”,“nextId”:2}。在创建/更新操作后使用Ember中的响应更新模板
我想在同一模板上显示成功消息(一个带有输入表单)。由于模板是指用户模型,用户模型没有消息属性。如何做呢?请帮忙。
这里是我的代码:
var Manager = Ember.Application.create();
Manager.Router.map(function() {
this.resource('users');
this.resource('user', {path: '/users/:user_id'});
this.resource('home', {path: '/'});
});
Manager.UserRoute = Ember.Route.extend({
model: function(params) {
return jQuery.getJSON("http://localhost:8085/users/"+ params.user_id);
},
actions :{
insert : function(){
var user = this.modelFor("User");
$.ajax({
url: "http://localhost:8085/Users",
data: JSON.stringify(user),
type: "POST",
contentType: "application/json",
})
.done(function(data){
//set data.message to display on UI
})
}
}
});
和我的模板看起来像这样:
<script type="text/x-handlebars" data-template-name="user">
<form class="form-horizontal" role="form" {{action "insert" on="submit"}}>
<div class="form-group">
<label for="userId" class="control-label col-xs-2">User Id</label>
<div class="col-xs-4 input-group">
{{input type="number" value=_id class="form-control" id="userId" placeholder="Identity"}}
</div>
</div>
<div class="form-group">
<label for="name" class="control-label col-xs-2">Name</label>
<div class="col-xs-4 input-group">
{{input type="text" value=name class="form-control" id="name" placeholder="Name"}}
</div>
</div>
{{#if message}}
<div class="alert alert-success input-group" role="alert">{{message}}</div>
{{/if}}
<div class="form-group button-center">
<button type="submit" class="btn btn-default">Submit</button>
</div>
</form>
</script>
设置你的控制器,该回来的响应上message
财产。
actions :{
insert : function(){
var user = this.modelFor("User");
var self = this;
$.ajax({
url: "http://localhost:8085/Users",
data: JSON.stringify(user),
type: "POST",
contentType: "application/json",
})
.done(function(data){
//set data.message to display on UI
self.controllerFor('user').set('message', data.message);
})
}
}
感谢您的回复。我试过这个,但是这在用户模型中添加了一个属性“消息”,这是我不想要的。 – ans7991 2015-02-09 17:58:57
@jcena - 这是在用户控制器上设置消息属性,而不是用户模型。您的模板绑定到控制器上的属性。现在,ember的工作方式是,如果控制器不包含具有相同名称的属性,则控制器将在模型上代理属性。当您使用我发布的实现时,行为是否与预期的一样? – 2015-02-09 18:55:49
你能否提供更多的代码?模板,控制器等? – 2015-02-09 15:19:33
@Oren,我添加了我的模板和js。 – ans7991 2015-02-09 17:19:33