在Ember中重置具有计算的oneWay属性的表单

时间:2015-02-06 11:11:57

标签: javascript forms ember.js binding

我正在对嵌入在模态中的表单进行建模,并且当我的路由在控制器中显式调用reset时,我希望它被重置。这是我在模态中管理的形式:

{{#modal-window title='Size management' close='removeModal'}}
  <label>
    <span>Size</span>
    {{input value=width class='width'}}
    <span>X</span>
    {{input value=height class='height'}}
  </label>
  <label>
    <span>Left</span>
    {{input value=left class='left'}}
  </label>
  <label>
    <span>Top</span>
    {{input value=top class='top'}}
  </label>
{{/modal-window}}

这是呈现/管理表单的控制器:

App.SizeEditorModalController = Ember.ObjectController.extend
  width: Ember.computed.oneWay 'model.width'
  height: Ember.computed.oneWay 'model.height'
  top: Ember.computed.oneWay 'model.top'
  left: Ember.computed.oneWay 'model.left'

  reset: ->
    # I'd like to restore the oneWay properties to its default values coming from the bound model

这是显示以前控制器所涉及的模态重置的路线。

App.ApplicationRoute = Ember.Route.extend
  actions:
    showModal: (name, model)->
      controller = @controllerFor name
      controller.reset()
      @render name,
        into:   'application'
        outlet: 'modal'
        model:  model
    removeModal: ->
      @disconnectOutlet
        outlet:     'modal'
        parentView: 'application'

当我为表单控件设置一些值时,它们会永远保留在那里,因为我使用oneWay属性并且我不知道是否存在任何重置这些属性以从源获取值的方法再绑定。 在点击“保存”之前,我不希望更新模型。按钮。 这是一个非常普遍的情况,我确信Ember有一个简单的方法来实现这一目标,但是,目前我看不出这是什么方式。

提前致谢

2 个答案:

答案 0 :(得分:0)

使用模型的回滚功能。 如果模型是脏的,您可以回滚它:

/**
If the model `isDirty` this function will discard any unsaved
changes
Example
```javascript
record.get('name'); // 'Untitled Document'
record.set('name', 'Doc 1');
record.get('name'); // 'Doc 1'
record.rollback();
record.get('name'); // 'Untitled Document'
```
@method rollback
*/

每个未保存的更改都将消失。

答案 1 :(得分:0)

这就是诀窍

App.register 'controller:size-editor-modal', App.SizeEditorModalController, { singleton: false }

如果我添加它,我的控制器不再是单例,然后每次模态需要时创建一个新实例。然后,控制器使用计算属性及其默认值来自模型。 我认为renderhttp://emberjs.com/api/classes/Ember.Route.html#method_render)方法在传递像renderhttp://emberjs.com/api/classes/Ember.Handlebars.helpers.html#method_render)帮助器这样的模型时会以这种方式运行,但它没有任何关系。 我仍然错过了这种情况,当我想要重置我的控制器计算的oneWay属性时,不需要创建一个新的控制器实例。