Uncaught ReferenceError: высота не определена - Backbone.js

Question

Прежде всего, я совершенно новичок в Backbone.js, и я использую this example, чтобы узнать.

Я пытаюсь получить значения из текстового ввода и создавать модели со входа. Шаблон должен быть загружен, а атрибут height из каждой модели должен отображаться в том же HTML.

Я могу создавать модели и добавлять их в коллекцию, так как я вижу n {length: 105, models: Array[105], _byId: Object} в console.log (Разделы). Однако (я угадываю), когда я пытаюсь загрузить шаблон, он дает мне ошибку: «Uncaught ReferenceError: height не определен». Я думаю, если я неправильно получаю атрибуты.

Любая помощь будет оценена! Заранее спасибо.

Вот шаблон:

<script type="text/template" id="section-template"> 
    <div class="view"> 
     <label><%- height %></label> 
     <label><%- color %></label> 
     <a class="destroy"></a> 
    </div> 
</script> 

Модель:

var Section = Backbone.Model.extend({ 
    defaults: function(){ 
     return { 
      height: 200, 
      color: '' 
     }; 
    } 
}); 

Модель Коллекция:

var SectionList = Backbone.Collection.extend({ 
    model: Section, 
    localStorage: new Backbone.LocalStorage("sections-backbone") 
}); 
var Sections = new SectionList; 

Model View Действие & событие:

var SectionView = Backbone.View.extend({ 
    tagName: "li", 
    template: _.template($("#section-template").html()), 
    initialize: function() { 
    }, 
    render: function() { 
     this.$el.html(this.template(this.model.toJSON())); 
     return this; 
    } 
}); 

Марка Применение:

var AppView = Backbone.View.extend({ 
    el: $("#sectionboard"), 
    events: { 
     "keypress #new-height": "createOnEnter" 
    }, 
    initialize: function() { 
     this.input = this.$("#new-height"); 
     this.main = $("#main"); 
     Sections.fetch(); 
    }, 
     createOnEnter: function(e) { 
     if (e.keyCode != 13) return; 
     if (!this.input.val()) return; 
     Sections.create({height: this.input.val(), color: '#FFFFFF'}); 
     this.input.val(""); 

     console.log(Sections); 

     var view = new SectionView({model: Sections}); 
     this.$("#section-list").append(view.render().el); 

     } 
}); 
var App = new AppView; 

Answer 1

Я думаю, что проблема здесь

var view = new SectionView({model: Sections}); 

Sections коллекция, но вы сообщаете вид, что это модель, так что конфликт существует.