将新模型添加到主干集合中,而不是替换

时间:2013-08-18 12:04:57

标签: javascript backbone.js collections model

我正在尝试将新模型添加到集合中(这次我没有保存到服务器,只是在内存中执行此操作)。我有以下代码:

$(function () {

//Model

var Story = Backbone.Model.extend({

  defaults: {
    'title': 'This is the title',
    'description': 'Description',
    'points': 0
  },

  url: '/'

});

//Collection

var Stories = Backbone.Collection.extend({

  model: Story,

  url: '/'

});

//View

var BaseView = Backbone.View.extend({

  el: $('#container'),

  events: {
    'click .inner': 'onClickInner'
  },

  onClickInner: function() {

    this.options.x++;

    this.story.set({
      'title': 'This is my collection test ' + this.options.x,
      'description' : 'this is the description'

    });

    this.stories.add(this.story);

    this.render();

  },

  initialize: function () {

    this.stories = new Stories();
    this.story = new Story();

  },

  render: function(){

      console.log(this.stories);

  }

});

//Initialize App

  var app = new BaseView({
    'x' : 0
  });

});

我的问题是,每次'onClickInner'运行时,我想为集合添加一个新模型。但是,在我的代码中,替换集合中的现有模型。如何添加新模型而不是替换?

感谢您的时间。

1 个答案:

答案 0 :(得分:11)

这是因为您更新了当前模型而不是添加新的模型。要解决此问题,您必须在集合上执行add方法。此方法将传递的数据作为新模型添加到您的集合中:

this.stories.add({
  'title': 'This is my collection test ' + this.options.x,
  'description' : 'this is the description'
});