通过收集骨干试图循环在DOM输出属性 [英] trying to loop through collection in backbone to output attributes in DOM

问题描述

我最近更新了我的骨干JS文件到最新版本，你怎么知道的东西都碎 - 这么折腾。我实例化集合的视图中，我通过收集试图循环，但它只是输出集合中的最后一个项目想不通为什么在这里是我的code

I recently updated my backbone js file to the newest version and what do you know stuff is breaking - so frustrating. I am instantiating a collection within a view and I'm trying to loop through the collection but it's only outputting the last item in the collection can't figure out why here is my code

 NavView = Backbone.View.extend({  
el : $('ul'), 
initialize: function(){

 _.bindAll(this, 'render');
  this.navCollection = new NavigationCollection([ {name: "home", href: '/home'},{name: "about", href:'/about'},{name: "contact", href: '/contact'}]); 
  this.render();

},

我已经尝试了很多方法来呈现以下

I have tried many ways to render the collection out code below

 render : function() {
  this.navCollection.each(function (item) {
        $(this.el).append("<li><a href=" + item.get("href") + ">" + item.get("name") + "</a></li>");
    }, this);
    return this; // remember this for chaining
  //also tried this method as well

 _.each(this.navCollection.models, function(item){
        //$(this.el).append("<li><a href=" + item.get("href") + ">" + item.get("name") + "</a></li>");
        $("<li><a href=" + item.get("href") + ">" + item.get("name") + "</a></li>").appendTo(this.el);
    },this)
    return this; // remember this for chaining
 },

无论哪种方式，它只是输出的最后一个项目接触代替三个项目
看到这里 http://dalydd.com/projects/backbone/backbone.html

var NavigationItem = Backbone.Model.extend({
    defaults: {
        name: '',
        href: '',
        last: false,
        id: ''
    },
    initialize: function() {

    }
});

var NavigationCollection = Backbone.Collection.extend({
    model: NavigationItem,
});

这是一切输出，但是当我更新骨干较新的版本它只是打印出前1 - 一如往常的任何帮助是AP preciated

Before it was outputting everything but when I updated backbone to newer version it is only printing out 1 - As always any help is appreciated.

感谢

推荐答案

在您NavigationItem定义，你ID的默认值设置为空字符串：

In your NavigationItem definition, you set the default value for id to an empty string :

var NavigationItem = Backbone.Model.extend({
    defaults: {
        name: '',
        href: '',
        last: false,
        id: ''
    }
});

在主干0.9.9，车型以相反的顺序添加和重复模型被拒绝，空字符串被接受为有效的身份证件，留下您的收藏在你的最后一个模型。删除默认值ID为您解决问题。

In Backbone 0.9.9, models are added in reverse order and duplicate models are rejected, an empty string being accepted as a valid id, leaving you with your last model in your collection. Remove the default value for id to solve your problem

var NavigationItem = Backbone.Model.extend({
    defaults: {
        name: '',
        href: '',
        last: false
    }
});

• 小提琴重现您的问题： http://jsfiddle.net/nikoshr/PmFEz/


• 系统修改小提琴： http://jsfiddle.net/nikoshr/PmFEz/1/


• A Fiddle to reproduce your problem : http://jsfiddle.net/nikoshr/PmFEz/
• A modified Fiddle : http://jsfiddle.net/nikoshr/PmFEz/1/

这篇关于通过收集骨干试图循环在DOM输出属性的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！