backbone.js - Backbone 集合长度始终设置为一个嵌套 View

Question

加载 View 时，集合长度始终返回 1，而当前有 3 个成员出现在解析函数中。我想知道问题是否出在嵌套项目 View 上，但没有 !我不明白为什么 self.push(member) 没有将模型添加到集合中!有点卡在这里，有什么帮助吗？

模型

define([
'backbone'
], function(Backbone) {
'use strict';

var MemberModel = Backbone.Model.extend({
  id: "_id"

});

return MemberModel;

});

合集

define([
'backbone', 
'models/MemberModel' 
], function(Backbone, MemberModel) {
'use strict';

var Members = Backbone.Collection.extend({
  model: MemberModel,
  url: '/api/v1/users',

  parse: function(response, options) {
     var self = this;

     _.each(response.users, function(item){
        var member = new self.model();
        member.set('email', item.email);
        member.set('firstname', item.firstname);
        member.set('lastname', item.lastname);
        member.set('group', item.group);
        member.set('city', item.city);

        // shows every member's emails
        console.log('member.email='+member.get('email'));
        self.push(member);

     });

     console.log('this.length='+this.length); // this is always equal to 1
     return this.models;

  }

});

return Members;


});

观点

define([
'collections/members',                        
'views/membersItem',
'text!templates/members.html'
], function(MembersCollection, MembersItem, membersTpl) {
'use strict';

var Members = Backbone.View.extend({
  el: '#settings-content',
   template: _.template(membersTpl),

  events: {
     'click #edit-member': 'editMember'
  },

  initialize: function() {     
     this.collection = new MembersCollection(); 

     this.render();
  },

  render: function() {
     this.$el.html(this.template(this.model.toJSON()));

     var self = this;

     this.collection.fetch({
        success: function() {
           self.renderMember();
        }
     });

     return this;
  },

  renderMember: function() {     
     // same here collection length = 1
     console.log('collection.length:'+this.collection.length);

     _.each(this.collection.models, function (item) {
        var memberView = new MembersItem({model: item});
        $('.list-item', this.el).append(memberView.render().el);
     }, this);

  }


});

return Members;
});

嵌套项目 View

define([                    
'text!templates/members_item.html'
], function(membersItemTpl) {
'use strict';

var MembersItem = Backbone.View.extend({
  tagName: "tr",
  className: '.item',
   template: _.template(membersItemTpl), 

  initialize: function() {
     this.model.bind("change", this.render, this);
  },

  render: function() {
     this.$el.html(this.template(this.model.toJSON()));
     return this;
  }

 });

 return MembersItem;
});

Answer 1

看起来问题出在集合中重复的 id 上。它应该是一个唯一标识符。

在模型中设置 idAttribute 并确保 3 个相关对象的 ID 不同。

var MemberModel = Backbone.Model.extend({
  idAttribute: "_id"

});

如果您的 ID 重复，则该模型将不会添加到模型中。

如果这不起作用，请尝试显式设置 id 属性

 _.each(response.users, function(item, index){
        var member = new self.model();
        member.set('_id', index);