骨干 - 无法循环收集

时间:2013-06-25 16:14:26

标签: javascript backbone.js underscore.js

我无法循环浏览一个有助于使用数据填充视图的集合。当我尝试遍历集合并得到以下错误时,

  

未捕获的TypeError:对象#没有方法'each'

我绝对不知道为什么我得到这个错误,除了obviosly没有那个方法的对象,但是当我运行drop函数时我只得到这个错误,见下面的代码。

这是骨干代码,

GroupListView.prototype.keyup = function() {
      this.filtered = this.collection.searchName(this.$el.find("#search-query").val());
      return this.renderList(this.filtered);
};

GroupListView.prototype.renderList = function(collection) {
  var $collection, $this;
  console.log(this.$el);
  console.log(collection);
  if (!collection) {
    collection = this.collection;
    console.log(collection);
  }
  this.$el.find(".list-items").empty();
  $this = this.$el.find("#people-groups-list");
  $collection = collection;
  if ($collection.length < 1) {
    this.$el.find("#people-groups-list").hide();
    return this.$el.find("#people-groups-list").after('<div class="activity-no-show">\
    <p>To add a new group, click the + in the top right hand corner to get started.</p>\
</div>');
  } else {
     this.$el.find("#people-groups-list").show();

    collection.each(function(item) {
      //console.log(item);
      var displayView;
      displayView = new app.GroupListDisplayView({
        model: item,
        collection: $collection
      });
      return $this.append(displayView.render());
    });
    return this;
  }
};

GroupListDisplayView.prototype.render = function() {
      var $body;
      //console.log(this.model.toJSON());
      this.$el.html(this.template({
        m: this.model.toJSON()
      }));
      $body = this.$el.find(".card-body");
      $.each(this.model.get("people"), function(i, person) {
        var personTile;
        this.person = new app.Person({
          id: person.id,
          avatar: person.avatar,
          first_name: person.first_name,
          last_name: person.last_name
        });
        console.log(this.person);
        personTile = new app.PersonTileView({
          model: this.person
        });
        return $body.html(personTile.render());
      });
      return this.$el.attr("id", "group-card-" + this.model.id);
    };

GroupListDisplayView.prototype.drop = function(e) {
      var $collection, $model, person_id, request;
      e.preventDefault();
      $collection = this.collection;
      person_id = e.originalEvent.dataTransfer.getData('Text');
      request = new app.PersonGroupAdd;
      $model = this.model;
      return request.save({
        async: true,
        wait: true,
        person_id: person_id,
        group_id: this.model.get("id")
      }, {
        success: function(d) {
          return $model.fetch({
            async: true,
            wait: true
          });
        }
      });
    };

GroupListView.prototype.initialize = function() {
      this.collection.on("change", this.renderList, this);
      this.collection.on("reset", this.render, this);
      return this.renderList();
    };

2 个答案:

答案 0 :(得分:0)

请尝试此操作,将此功能放在您的收藏中

parse: function (data) {

            data.forEach(function (item) {

                displayView = new app.GroupListDisplayView({
                  model: item,
                  collection: $collection
                });
            });
        }

希望这有帮助。

答案 1 :(得分:0)

我不确定drop函数与它有什么关系,但我在renderList期间看到searchName传递了keyup的结果。可能发生的是searchName返回一个常规数组,而不是一个包含each方法的包装对象(即Backbone.Collection,jQuery集合或Underscore包装对象)。

不使用collection.each,而是使用jQuery或Underscore:

$.each(collection, function(i, item) { ... });

_.each(collection, function(item, i, list) { ... });