从backbonejs中的集合中通过id获取模型答案

【问题标题】：get model by id from collection in backbonejs从backbonejs中的集合中通过id获取模型
【发布时间】：2014-05-15 04:52:00
【问题描述】：

我有以下类型的集合

[
   {
     "id": "2324324",
     "name": "name",
     "type": "type",

 },
{
    "id": "59980",
    "name": "name",
    "type": "type",

}

]

型号：

define(['underscore', 'backbone'], function(_, Backbone){
//Define Alert model with default properties and value
var abcModel = Backbone.Model.extend({
    idAttribute:"_id",
    defaults:{
       // My properties
    },
    initialize:function(){          

    }
});
return abcModel;
});

 define(['underscore', 'backbone', 'models/abcModel', 'app/utils'], function(_, Backbone, abcModel, Utils) {

    var self;
    //List of Alerts stored in Backbone Collection
    abcListCollection = Backbone.Collection.extend({
        model: abcModel ,
        initialize: function() {           
            self = this;
            this.model=abcModel ;
        },

       fetchData: function(obj) {           
            add=true;
            var data = {
                "method": "method name",
                "params": {
                    param1:"param1",
                    param2:"param2"
                }
            }

            Utils.Ajax.post(Utils.WebAPI.WebAPIServer, data, function(response, textStatus, jqXHR) {                                
                obj.success.call(self.collection, response);
            }, 'json', function(err) {
                console.log(JSON.stringify(err));
                obj.error.call(err);
            }, "loading");

        },
        collection: {}
         });
        return abcListCollection;
});

查看

 define(['jquery', 'underscore', 'backbone', 'text!views/abcView/abcListView.html','views/abcView/ListTemplate' ,'app/utils', 'collection/abcListCollection'], function($, _, Backbone, tmpl_abcummaryView, abcListView, Utils, abcListCollection) {

 var abcListView = Backbone.View.extend({
// Setting the view's template property using the Underscore template method        
template: _.template(tmpl_abcummaryView),
// View constructor
initialize: function() {            
    abcCollection= new abcListCollection();
        mainRouter.collections.abc= new abcListCollection();          
},
// View Event Handlers
events: {

},
// Renders the view's template to the UI
render: function() {
    var self=this;
    this.$el.html(this.template({data: this.templateData}));   
    abcCollection.fetchData({
                success: function (collection, response) {                        
                    _.each(collection, function (obj) {                             
                        mainRouter.collections.abc.add(obj);                                                       
                    })
                },
                error: function (err) {
                    console.log("error");
                }
        });         
    var model1=mainRouter.collections.abc.get(2324324);
    // Maintains chainability
    return this;
}
});
return abcListView;
 });

var model1=mainRouter.collections.abc.get(2324324); 但它返回未定义。

【问题讨论】：

您在集合中的模型参数是未定义的 abcSummaryModel。我想你的意思是 abcModel。
-1 也可以更具体地说明您的问题。 “它返回未定义”是什么意思

标签： backbone.js backbone.js-collections

【解决方案1】：

你可以试试

mainRouter.collections.abc.findWhere( { id : 2324324 });

但是，您的时间似乎也可能已经结束。

.fetchData 函数将是一个异步调用，这意味着成功函数实际上会在该行之后执行

var model1 = mainRouter.collectins.abc.get(2324324);

在上面的行上放一个调试断点，还有success函数——看看哪个先执行。

【讨论】：

mainRouter.collections.abc.findWhere( { id : 2324324 });未定义，我使用过 mainRouter.collections.abc.findWhere({ id : 2324324 });在路由器和控制台中是可用的。
您是否排除了这是时间问题？如果您在代码中放置两个断点 - 一个在 _.each(collection, function (obj) 上，另一个在 var model1=mainRouter.collections.abc.get(2324324); - 它们是否以正确的顺序触发？
yes _.each(collection, function (obj) is in view and using collection from there 我将元素添加到 mainRouter.collections.abc 然后在路由器文件中我正在执行 mainRouter.collections.abc .findWhere( { id : 2324324 }); 在此之前我有 console.log(mainRouter.collections.abc) 它返回集合中的所有数据

【解决方案2】：

您的 fetchData 是一个异步函数。解决异步调用后，它将在事件循环中执行。您的代码在该调用中没有阻塞。它只是遍历并完全执行渲染功能。一段时间后，当该调用返回并且您的成功回调将被调用时，您会在您的集合中获得一些东西。

把从集合中获取模型的代码放上去是对的，应该在你把模型添加到集合后放在回调中。

见Collection get http://backbonejs.org/#Collection-get

所以一种方法是写：

success: function (collection, response) {                        
                    _.each(collection, function (obj) {                             
                        mainRouter.collections.abc.add(obj);                                                       
                    })
                 var model1 = mainRouter.collectins.abc.get(2324324);
                },

但是，在您的视图中使用您的模型似乎并不正确。但这是你必须考虑的设计问题。

另外，我认为您应该阅读更多有关 Javascript 事件驱动架构的内容。我写了一个简单的博客：Learning Javascript

【讨论】：