Ember数据重置记录

时间:2015-11-10 18:27:37

标签: ember.js ember-data

在我的路线上,我有一个客户列表和一个添加新客户的表单。 我在setupController钩子中创建一个空记录。此记录绑定到表单。我的想法是:在保存记录时,我制作一份(深层)副本,保存副本,然后通过http://emberjs.com/api/data/classes/DS.Model.html#method_rollbackAttributes将记录重置为空状态。

看起来不会起作用,因为

  

如果模型是新的,它将从商店中删除。

我该如何处理这种情况?什么是最佳做法?

我制作了一个JsBin来演示这个问题。 http://jsbin.com/weqotoxiwe/3/edit?html,js,output。 尝试输入内容,然后保存。 (它应该清空记录)然后再次输入。它在控制台中产生以下错误:

未捕获错误:在状态root.deleted.saved中尝试处理事件didSetProperty。用{name:name,oldValue:sds,originalValue:undefined,value:sdsd}调用。

以下是摘录:



App = Ember.Application.create();

App.Router.map(function() {
  // put your routes here
});

App.ApplicationAdapter = DS.RESTAdapter;

App.Customer = DS.Model.extend({
  name: DS.attr('string'),
  city: DS.attr('string')
});

App.IndexRoute = Ember.Route.extend({
  model: function() {
    return this.store.findAll('customer');
  },
  setupController: function(controller, model) {
    this._super(controller, model);
    var empty = this.store.createRecord('customer');
    controller.set('empty', empty);
  },
  actions: {
    save: function(record) {
      /*
      record.copy().then(function(copy){
        copy.save();
      })*/
      record.rollbackAttributes();
    }
  }

});



/*---------------Data------------------*/
var customers = {
  "customers": [{
    "id": 1,
    "name": "Terry Bogard",
    city: 'Delaware'
  }, {
    "id": 2,
    "name": "Joe Higashi",
    city: 'Tokyo'
  }, {
    "id": 3,
    "name": "Richard Meyer",
    city: 'Albuquerque'
  }, {
    "id": 4,
    "name": "Kim Kaphwan",
    city: 'Seoul'
  }, {
    "id": 5,
    "name": "Ryo Sakazaki ",
    city: 'Tokyo'
  }, {
    "id": 6,
    "name": "Takuma Sakazaki ",
    city: 'Tokyo'
  }, ]
};

$.mockjax({
  url: '/customers',
  dataType: 'json',
  responseText: customers
});

<!DOCTYPE html>
<html>

<head>
  <meta charset="utf-8">
  <title>Ember Starter Kit</title>
  <link rel="stylesheet" href="http://cdnjs.cloudflare.com/ajax/libs/normalize/3.0.1/normalize.css">
  <link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css" rel="stylesheet">

  <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
  <script src="http://builds.emberjs.com/beta/ember-template-compiler.js"></script>
  <script src="http://builds.emberjs.com/beta/ember.debug.js"></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-mockjax/1.6.2/jquery.mockjax.min.js"></script>
  <script src="http://builds.emberjs.com/beta/ember-data.min.js"></script>

  <link href="//maxcdn.bootstrapcdn.com/font-awesome/4.1.0/css/font-awesome.min.css" rel="stylesheet">
</head>

<body>

  <script type="text/x-handlebars">
    <h2>Table example</h2>
    {{outlet}}
  </script>

  <script type="text/x-handlebars" data-template-name="index">
    {{input value=empty.name}}
    <button {{action 'save' empty}}>Save</button>

    {{#each model as |record|}}
    <div>{{record.name}}</div>
    {{/each}}
  </script>



</body>

</html>
&#13;
&#13;
&#13;

更新

在我的应用程序中,我在应用程序路径中的一个中心位置处理所有保存。通常我会使用http://emberjs.jsbin.com/jipani/edit?html,js,output将操作发送到路线。

1 个答案:

答案 0 :(得分:0)

我会保存绑定到表单的记录(不是它的深层副本),然后创建一个新记录并将其附加到表单。无需深陷复制或回滚。

你应该在控制器(coffeescript)上完成所有这些 -

newEmpty: (->
    empty = @store.createRecord('customer')
    @set('empty', empty)
).on('init')

actions:
    saveEmpty: ->
        @get('empty').save().then =>
            @newEmpty()    

请注意,初始化控制器时运行on('init')需要newEmpty