Question

我是Backbone的新手并尝试运行以下代码。但我不知道怎么理解。它工作不正常。更清楚的是，当我创建集合时，listenTo没有捕获创建事件。

这是我的代码

var levelIndex=0;
var app =  {};
$(function(){
  $('.datepicker').datepicker({
    format: 'dd/mm/yyyy',
    startDate: '-3d'
  });  

  //model
  app.Level = Backbone.Model.extend({
      defaults: {
          levelIndex:-1
      }
  });

  //collection
  app.Levels= Backbone.Collection.extend({
    model: app.Level,
    url:'#'
  });

  //views
  app.LevelView = Backbone.View.extend({
    events: {
      'click .addItems': 'addItems',
      'click .clearItems': 'clearItems',
      'click .removeLevel':'removeLevel'
    },
    addItems: function () {
      // add items
    },
    clearItems:function(){
      //
    },
    removeLevel:function(){
      //
    },
    tagName: 'div',
    className: 'level active',
    template: _.template($('#levelTemplate').html()),
    render: function () {
        this.$el.html(this.template(this.model.toJSON()));
        return this;
    }
  });

//levels view
  app.LevelsView = Backbone.View.extend({
    events: {
        'click .add': 'addLevel'
    },

    addLevel: function( e ) {
      e.preventDefault();
      console.log('inside add level function');
      var formData = {};
      formData['levelIndex']=levelIndex++;
      this.collection.create( formData );
      console.log('after creating collection');
    },  

    el: '#levels',

    initialize: function() {

    this.collection=new app.Levels(new app.Level());
      //following line of code doesnt work properly
      this.listenTo( this.collection, 'create', this.renderLevel );
    },

    // render levels view by rendering each level in its collection
    render: function () {
        this.collection.each(function (item) {
            this.renderLevel(item);
        }, this);
    },
    // render a level by creating a LevelView and appending the
    // element it renders to the levels' element
    renderLevel: function (item) {
      var levelView = new app.LevelView({
        model: item
      });
      this.$el.append(levelView.render().el);
    }
  });
  new app.LevelsView();
});

Answer 1

集合或模型上没有事件create。在您的情况下，您希望使用在模型添加到集合时触发的事件add。但是你会错过一个模型添加，因为你在开始聆听之前添加了第一个模型。

http://backbonejs.org/#Events-catalog

关于Collection.create()：

创建模型会立即导致＆＃34;添加＆＃34;要在集合上触发的事件，＆＃34;请求＆＃34;事件将新模型发送到服务器，以及＆＃34;同步＆＃34;事件，一旦服务器响应成功创建模型。如果您想在将新模型添加到集合之前等待服务器，请通过{wait：true}。

骨干听不解雇

1 个答案: