Question

以下行完全失败。

template: _.template($('#test').html()),

尝试按照https://github.com/ccoenraets/backbone-jquerymobile中的一个简单示例来使用jQuery mobile和Backbone.js。我在Web检查器中得到的错误是：TypeError：'null'不是一个对象（评估'str.replace'），它位于underscore.js的第913行。以这种方式使用_.template：

template: _.template("<h1>To Do</h1>"),

有效，但为了合并jQuery移动样式，这种方式不行。

todo.js

TodoBb.Views.ComCentersTodo = Backbone.View.extend({

template: _.template($('#test').html()),


render: function() {
    $(this.el).html(this.template());
    return this;
}
});

main.html中

<script type = 'text/template' id = 'test'> <h1>To Do</h1> </script>

Answer 1

在解析您的视图时，DOM还没有准备就绪：

TodoBb.Views.ComCentersTodo = Backbone.View.extend({
    template: _.template($('#test').html()),
    //...
});

所以$('#test').html()是null，而您实际上是这样做的：

TodoBb.Views.ComCentersTodo = Backbone.View.extend({
    template: _.template(null),
    //...
});

_.template的内部使用replace，同时将模板转换为JavaScript函数。

您有几个选择：

将TodoBd.Views.ComCentersTodo定义放在$(document).ready()处理程序中：

$(function() {
    TodoBb.Views.ComCentersTodo = Backbone.View.extend({
        template: _.template($('#test').html()),
        //...
    });
});

在您需要之前不要编译模板：

TodoBb.Views.ComCentersTodo = Backbone.View.extend({
    //... no template in here
    render: function() {
        var html = _.template($('#test').html(), this.model.toJSON());
        this.$el.html(html);
        return this;
    },
    //...
});

作为 2 的变体，您可以在某处缓存已编译的模板函数，并且只在第一次使用时调用_.template($('#test').html())。

Unbonecore.js模板与Backbone.js错误

1 个答案: