0

まず、私の素朴な質問をお許しください。簡単な答えがあることはわかっていますが、現在学習JavaScriptBackBone同時にいくつかの問題に直面しています。

JavaScriptファイルの情報のコレクションからビューにテーブルを追加しようとしているだけです。ここに私のjsファイルがあります:

(function(window,app,$){

    app.views.itemsIndex = Backbone.View.extend({
        id:"items-index",

        initialize:function(){

        },

        events:{

        },

        render:function(){
            template = new EJS({
                url:"js/templates/patron/items/itemsIndex.ejs"
            });

            this.$el.html(template.render());

            this.createDummies()

            return this;
        },

        createDummies:function(){

            var bookCollection = new app.collections.books();

            for (var i = 0; i < 10; i++) {
                var book = new app.models.book({title : 'title ' + i});
                bookCollection.add(book);

                var item = new app.views.itemsItem();
                this.$el.append(item.render().el);
            };

            console.log(bookCollection);
        }
    });

})(window,window.circulationApp || {},$)

Uncaught ReferenceError: book is not definedというエラーでビューをレンダリングしようとすると、エラーが発生します

以下は私のejsファイルです:

<td>
    <div class="td-wrap">
        <%= book.escape('title') %></td>
    </div><!-- .td-wrap -->

何かご意見は?

4

1 に答える 1

1

全体を理解していませんが、私の理解では、<td>要素を介して本のコレクションをレンダリングしたいと考えています

EJS はループをサポートしているように見えるので、 Collection をビューに直接挿入して、 book をループしてみませんか?

<% for (var i = 0; i < books.length; i++) {%>
    <%= books[i].escape('title'); %>
<% } %>

createDummiesCollection を返します:

createDummies: function() {
    var bookCollection = new app.collections.books();
    for (var i = 0; i < 10; i++) {
        var book = new app.models.book({title : 'title ' + i});
        bookCollection.add(book);
    };
    return bookCollection;
}

それをレンダリングするには:

var tpl = new EJS({
    url:"js/templates/patron/items/itemsIndex.ejs"
});

var booksCollection = this.createDummies();

this.$el.html(tpl.render({books: booksCollection}));

理想的には、Backbone でのみrenderメソッドを使用し$elて HTML を入力する必要があります。

于 2012-11-13T19:44:57.077 に答える