2014-02-01 4 views
0

Я пытаюсь привести пример из книги «Разработка приложений Backbone.js». Я воспроизвел часть кода ниже. Когда app.js вызывается, я получаю следующую ошибку в методе renderBook библиотеки (library.js).Backbone TypeError view не является конструктором

TypeError: app.BookView не конструктор

Может кто-то мне помочь, пожалуйста?

// Просмотр для книги (сайт/JS/просмотров/book.js)

var app = app || {}; 

app.BookView = Backbone.View.extend({ 
    tagName: 'div', 
    className: 'bookContainer', 
    template: _.template($('#bookTemplate').html()), 

    render: function() { 
     // tmpl is a function that takes a JSON object and returns html 

     // this.el is what we defined in tagName. use $el to get access 
     // to jQuery html() function 
     this.$el.html(this.template(this.model.toJSON())); 

     return this; 
    } 
}); 

// Просмотр для библиотеки (сайт/JS/просмотров/library.js)

var app = app || {}; 

app.LibraryView = Backbone.View.extend({ 
    el: '#books', 

    initialize: function(initialBooks) { 
     this.collection = new app.Library(initialBooks); 
     this.render(); 
    }, 

    // render library by rendering each book in its collection 
    render: function() { 
     this.collection.each(function(item) { 
      this.renderBook(item); 
     }, this); 
    }, 

    // render a book by creating a BookView and appending the 
    // element it renders to the library's element 
    renderBook: function(item) { 
     var bookView = new app.BookView({ 
      model: item 
     }); 
     this.$el.append(bookView.render().el); 
    } 
}); 

// Главное приложение (сайт/JS/app.js)

var app = app || {}; 

$(function() { 
    var books = [ 
     { title: 'JavaScript: The Good Parts', author: 'Douglas Crockford', 
      releaseDate: '2008', keywords: 'JavaScript Programming' }, 
     { title: 'The Little Book on CoffeeScript', author: 'Alex MacCaw', 
      releaseDate: '2012', keywords: 'CoffeeScript Programming' }, 
     { title: 'Scala for the Impatient', author: 'Cay S. Horstmann', 
      releaseDate: '2012', keywords: 'Scala Programming' }, 
     { title: 'American Psycho', author: 'Bret Easton Ellis', 
      releaseDate: '1991', keywords: 'Novel Splatter' }, 
     { title: 'Eloquent JavaScript', author: 'Marijn Haverbeke', 
      releaseDate: '2011', keywords: 'JavaScript Programming' } 
    ]; 

    new app.LibraryView(books); 
}); 

файл HTML включает все JS в следующем порядке:

<script src="js/lib/jquery.min.js"></script> 
<script src="js/lib/underscore-min.js"></script> 
<script src="js/lib/backbone-min.js"></script> 
<script src="js/models/book.js"></script> 
<script src="js/collections/library.js"></script> 
<script src="js/views/book.js"></script> 
<script src="js/views/library.js"></script> 
<script src="js/app.js"></script> 

Спасибо.

+0

Попробуйте обернуть объявления BookView & LibraryView в onload '$ (function() {}' blocks. Это единственное, что я могу придумать. Backbone.View.Extend - это функция, и поэтому ее необходимо выполнить. –

+0

Спасибо за то, что вы не могли сказать мне цель этого? Все ли мой скрипт должен быть внутри блока onload? – user3261334

+0

Я искал Google и нашел причину. Спасибо, хотя и в этой книге не упоминалось об этом. – user3261334

ответ

1

Попробуйте обернуть ваш BookView & Заявки на библиотечный просмотр в onload $(function() {} блоки. Это единственное, о чем я могу думать. Backbone.View.Extend - это функция и, следовательно, ее необходимо выполнить.

Как вы это делаете, вы устанавливаете приложение.BookView равным функции Backbone.View.Extend, а не значением, возвращаемым функцией.

Смежные вопросы