Question

假设我有一个拥有多个序列的电影模型。当显示编辑电影的页面时，我显示序列并允许用户在页面上内嵌编辑任何序列。

该页面使用MovieEditController中的数组代理显示已排序的序列：

sequences: function() {
  return Ember.ArrayProxy.createWithMixins(Em.SortableMixin, {
    sortProperties: ['start'],
    content: this.get('model.sequences')
  });
}.property('model.sequences')

编辑序列的start属性时会出现问题。当填写属性输入字段时，页面上显示的序列列表将被使用。相反，只有在保存并保留更改后才能使用该列表。

最常用的Ember方式是什么？

Answer 1

在这里，我创建了一个ModelProxy mixin，因此我可以使用一个中间代理对象：

var defineProperty = Ember.defineProperty;

var ModelProxy = Ember.ObjectProxy.extend({
  model: Ember.computed.alias('content'),

  // override this ObjectProxy method to not propagate changes to the model
  setUnknownProperty: function(key, value) {
    defineProperty(this, key, null, value);
    return value;
  },

  // only propagate proxy attributes when the proxy is saved
  save: function() {
    var keys = Em.keys(this),
        content = this.get('content');

    keys.forEach(function(key) {
      content.set(key, self.get(key));
    }, this);

    return content.save();
  }
});

var ModelProxyMixin = Ember.Mixin.create({
  proxy: null,

  init: function() {
    this._super();
    this.set('proxy', ModelProxy.create({ model: this }));
  },

});

这被混合到序列模型中：

var Sequence = DS.Model.extend(ModelProxyMixin, { /*..*/ });

电影/编辑模板然后在显示内联表单字段时使用代理：

{{#each s in sequences itemController='sequence'}}
    {{#if isEditing}}
        {{#with s.proxy}}
        <tr>
            <td><button {{action 'save'}}>Save</td>
            <td>{{input value=start}}</td>
        </tr>
        {{/with}}

SequenceController在代理上调用#save，然后更新原始模型：

actions: {
  save: function() {
    this.get('model.proxy').save().then(function() {
      this.toggleProperty('isEditing');
    });
  }

如何在Ember / Ember-Data中保存已编辑的列表项之前延迟使用渲染列表？

1 个答案: