假设我有一组可编辑的用户,当一个人去编辑该用户时,Ember将在您键入绑定输入文本字段时同步更新所有视图。
这很酷,但从用户体验的角度来看,它可能具有误导性......这些值在服务器上根本没有改变。我想做的是推迟视图更新,直到我根据来自服务器的成功消息在相应的操作方法中设置它。
我发现当我使用 {{bind-attr value=firstName}}
而不是 {{input value=firstName}}
时,余烬确实不再更新更改输入字段的视图,但是无法再通过 this.get('firstName') 在操作提交方法中访问新键入的值?
例子.hbs
<script type="text/x-handlebars" id="user">
<h3>Edit {{fullName}}</h3>
<p>
<label>First Name</label>
{{input value=firstName}}
</p>
<p>
<label>Last Name</label>
<input {{bind-attr value=lastName}} />
</p>
<p>
<button {{action 'submit'}}>Submit</button>
</p>
</script>
示例控制器
App.UserController = Ember.ObjectController.extend({
actions: {
submit: function(){
// call to server, on confirmation set 'Globally' first and last names
console.log(this.get('firstName') + " - " + this.get('lastName'));
}
}
});
这是我的 jsbin:http://jsbin.com/jipik/2/edit?html,js,console,output
您所需要的只是一组辅助变量。 将一个名为 firstNameEdited
的变量添加到控制器中,并将其值最初设置为 firstName
。 值将您的输入字段绑定到此新值,并将此新值提交到 api 调用。 成功返回 API 调用后,使用 firstNameEdited
的值更新firstName
。