Коллекция не является функцией или Коллекция не является конструктором в Backbone - PullRequest
Новая
       17

Коллекция не является функцией или Коллекция не является конструктором в Backbone

0 голосов
/ 27 марта 2012

Этот мой код продолжает выдавать ошибку, я не понимаю, почему. 

var id = $(ev.currentTarget).data("id");
    var item = ItemCollection.getByCid(id);
    alert(item.get("ItemCode"));
    var qty = 1;
    var cartcollection = new CartCollection();
    cartcollection.add( item );
    CartListView.render();
    var itemcode = cartcollection.where({ItemCode: item.get("ItemCode")});
    if( itemcode.length > 0 ){ alert("success"); }

Итак, я хочу проверить, есть ли у CartCollection та же модель, и если она истинна, она должна обновлять атрибут Qty только модели. Теперь, основываясь на этом коде, он возвращает CartCollection не является функцией или не конструктором. Какого черта это !? Есть идеи? Спасибо

Обновление

Я использую основу, require, сетку KendoUI и подчеркивание на этом, так что мой код такой:

itemlist_view.js 

define([
'jquery',
'underscore',
'backbone',
'model/item_model',
'model/cart_model',
'collection/item_collection',
'collection/cart_collection',
'view/cart/cartlist_view',
'text!templates/items/itemlist.html'
 ],function($, _, Backbone, Item, Cart, ItemCollection, CartCollection, CartListView, ItemListTemplate){

var ItemListView = Backbone.View.extend({
el: $("#mainContainer"),
events:{
    "click #itemListContainer li" : "AddToCart"
},
initialize: function(){
  this.model = Item;
  this.collection = ItemCollection;
  this.collection.bind("reset", this.render );
},
render: function(){
  var data = {
    items: ItemCollection.models
  }
  var compiledTemplate = _.template( ItemListTemplate , data);
  $("#itemContainer").html( compiledTemplate );
},
AddToCart:function(ev){
    ev.preventDefault();
    var id = $(ev.currentTarget).data("id");
    var item = ItemCollection.getByCid(id);
    alert(item.get("ItemCode"));
    var qty = 1;
    var cartcollection = new CartCollection();
    cartcollection.add( item );
    CartListView.render();
    var itemcode = cartcollection.where({ItemCode: item.get("ItemCode")});
    if( itemcode.length > 0 ){ alert("success"); }
}
});
return new ItemListView;
});

cart_collection.js 

define([
'underscore',
'backbone',
'model/cart_model'
],function(_, Backbone, Cart){
var CartCollection = Backbone.Collection.extend({
    model: Cart,
  initialize: function(){

  }
});
return new CartCollection;
 });

cartlist_view.js 

define([
 'jquery',
 'underscore',
 'backbone',
 'model/cart_model',
 'collection/cart_collection',
 'text!templates/cart/cartlist.html'
 ], function($, _, Backbone, Cart, CartCollection, CartListTemplate){

var Model = kendo.data.Model,
    ObservableArray = kendo.data.ObservableArray;

function wrapBackboneModel(backboneModel, fields) {
    return Model.define({
        fields: fields,
        init: function(model) {
            if (!(model instanceof backboneModel)) {
                model = new backboneModel(model);
            }

            Model.fn.init.call(this, model.toJSON());
            this.backbone = model;
        },
        set: function(field, value) {
            Model.fn.set.call(this, field, value);

            this.backbone.set(field, value);
        }
    });
}

function wrapBackboneCollection(model) {
    return ObservableArray.extend( {
        init: function(collection) {
            ObservableArray.fn.init.call(this, collection.models, model);

            this.collection = collection;
        },

        splice: function(index, howMany) {
            var itemsToInsert, removedItemx, idx, length;

            itemsToInsert = Array.prototype.slice.call(arguments, 2);

            removedItems = kendo.data.ObservableArray.fn.splice.apply(this, arguments);

            if (removedItems.length) {
                for (idx = 0, length = removedItems.length; idx < length; idx++) {
                    this.collection.remove(removedItems[idx].backbone);
                }
            }

            if (itemsToInsert.length) {
                for (idx = 0, length = itemsToInsert.length; idx < length; idx++) {
                    this.collection.unshift(itemsToInsert[idx].backbone);
                }
            }

            return removedItems;
        }
    });
}

kendobackboneCollection = wrapBackboneCollection;
kendobackboneModel = wrapBackboneModel;


var CartListView = Backbone.View.extend({
el: $("#cartContainer"),

initialize: function(){
  this.collection = CartCollection;
  this.model = Cart;
  this.collection.bind("change", this.render );
},
render: function(){
  console.log("here");
  this.el.html(CartListTemplate);
  var CartWrapper = kendobackboneModel(Cart, {
     ItemCode: { type: "string" },
     ItemDescription: { type: "string" },
     RetailPrice: { type: "string" },
     Qty: { type: "string" },
  });
  var CartCollectionWrapper = kendobackboneCollection(CartWrapper);

  this.$("#grid").kendoGrid({
    editable: true,
    toolbar: ["create"],
    columns: ["ItemDescription", "Qty", "RetailPrice"],
    dataSource: {
      schema: {model: CartWrapper},
      data: new CartCollectionWrapper(CartCollection),
     }
  });

},

});
return new CartListView;
});

1 Ответ

0 голосов
/ 28 марта 2012

Я думаю, проблема в том, что вы дважды создаете экземпляр CartCollection.То есть cart_collection.js возвращает new CartCollection(), а в itemlist_view.js вы создаете его снова с помощью var cartcollection = new CartCollection();.

Измените эту строку на var cartcollection = CartCollection; и посмотрите, как это происходит.Очевидно, что вы также можете удалить переменную cartcollection и заменить ее использование на CartCollection.

С другой стороны, я бы серьезно подумал НЕ возвращать new CartCollection() из вашего cart_collection.js.Это очень плохая практика, потому что вы сможете использовать только один экземпляр этой коллекции.Кроме того, для разработчика не очевидно, что они возвращают экземпляр коллекции, а не конструктор для него.

Я бы порекомендовал вернуть CartCollection в исходное состояние, а затем создать его экземпляр в вашем itemlist_view.js файл с new CartCollection().Таким образом, вы сможете при необходимости создать больше экземпляров этих коллекций позже.

Та же рекомендация для cartlist_view.js, возвращающей new CartListView().

...