【问题标题】:How to Defer Ember views from synchronously updating from bound input fields如何推迟 Ember 视图从绑定的输入字段同步更新
【发布时间】:2014-02-27 19:47:30
【问题描述】:

假设我有一组可编辑的用户,当一个用户编辑该用户时,ember 将在您在绑定的输入文本字段中键入时同步更新所有视图。

这很酷,但从用户体验的角度来看,它可能会产生误导.. 这些值在服务器上根本没有改变.. 我想做的是将视图更新推迟到我设置它根据来自服务器的成功消息在相应的操作方法中。

我发现,当我使用 {{bind-attr value=firstName}} 而不是 {{input value=firstName}} 时,确实 ember 不再更新更改输入字段的视图,但是在操作提交方法中不再可以通过 this.get 访问新键入的值('名字')?

Example.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

【问题讨论】:

    标签: ember.js


    【解决方案1】:

    您所需要的只是一组辅助变量。将一个名为firstNameEdited 的变量添加到您的控制器,并将其值初始设置为firstName。值将您的输入字段绑定到这个新值,并将这个新值提交给您的 api 调用。 API 调用成功返回后,将 firstName 更新为 firstNameEdited 的值。

    【讨论】:

    • 你先生是个天才:)
    猜你喜欢
    • 2017-11-11
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2020-12-02
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多