javascript - 我的 Backbone 文件出现类型错误？

Question

所以我会将错误与我的 main.js 文件一起包含在内，如果有人可以告诉我它指的是什么？我认为这是模板的问题，但我无法弄清楚我做错了什么。

Main.js 文件:

(function(){

    //app can be the name of the project/app
    window.App = {
        Models: {},
        Collections: {},
        Views: {},
        Templates: {},
        Routes: {}

    };
    window.template = function (id) {
        return _.template($('#' + id).html());
    };

    //Can get rid of the Collection and views out of the names of each
    //User Model
    App.Models.User = Backbone.Model.extend({
        defaults: {
            firstName: 'J.R.',
            lastName: 'Smith',
            email: 'jsmith@knicks.com',
            phone: '212-424-6234',
            birthday: '03/05/1982',
            city: 'New York'

        },


        location: function(){
            return this.get('firstName') + ' ' + this.get('lastName') + 'is currently in ' + this.get('city') + '.';
        },

        validate: function(attrs) {
            if(!attrs.firstName) {
                return 'You must enter a real name.';
            }
            if(!attrs.lastName) {
                return 'You must enter a real name.';
            }
            if(attrs.email.length < 5 ) {
                return 'You must enter a real email.';
            }
            if(attrs.phone.length < 10 && attrs.phone === int) {
                return 'You must enter a real phone number, if you did please remove the dash and spaces.';
            }
            if(attrs.city.length < 2 ) {
                return 'You must enter a real city.';
            }
        },

        initialize: function(){
            this.on('invalid', function(model, error){
            console.log(error);
            //when setting a user user.set('age', -55, {validate : true}); the validate true makes sure it validates
            });
        }

    });

    // list of users

    App.Collections.UsersCollection = Backbone.Collection.extend({
        model: App.Models.User

    });

    //User View
    App.Views.UserView = Backbone.View.extend({
    tagName: 'li',

    events: {
        'click .edit': 'edit'
    },

    edit: function() {

    },

    template: template('userTemplate'),

    initialize: function() {
        console.log("Render");
        this.render();

    },

    render: function() {
        var template = this.template(this.model.toJSON());
        this.$el.html(template);
        return this;
        //always return this on render methods
    }

    }); 

    // view for users
    App.Views.UsersView = Backbone.View.extend({
        tagName: 'ul',

        initialize: function() {

        },

        render: function() {
            this.collection.each(function(user) {
                //user is the model associated to the new created user
                var userView = new App.Views.UserView({model: user});
                this.$el.append(userView.el);
            }, this);
            return this;
        }
    });



    /*var user = new App.Collections.UsersCollection(  );
    var usersView = new App.Views.UsersView( users );

    $( document.body ).append( usersView.render().el );
    */
})();

这是 Jade 文件:

extends layout

block content
    h1= title
    p Welcome to #{title}
    script(src='/js/main.js', type='text/javascript')
    script(id='userTemplate', type='text/template')
        <%=firstName%>
        button.edit Edit
        <%=lastName%>
        button.edit Edit
        <%=email%>
        button.edit Edit
        <%=phone%>
        button.edit Edit
        <%=birthday%>
        button.edit Edit
        <%=city%>
        button.edit Edit

Answer 1

我认为您没有将 JSON 模型传递给模板函数。

您是否尝试过按如下方式修改代码:

全局模板功能

window.template = function (id, model) {
    return _.template($('#' + id).html(), model);
}; 

在您的用户 View 中

template: function() {
    template('userTemplate', this.model.toJSON());
}

render: function() {
    var template = this.template();
    this.$el.html(template);
    return this;
    //always return this on render methods
}