Question

我正在尝试使用backbone.js开发一个简单的RSS应用程序。我正在使用这个backbone.js tutorial。在定义模板时，我在第2行（模板）上收到以下错误。有人也可以告诉我为什么tagName：“li”在教程中定义了吗？

未捕获的TypeError：无法调用undefined的方法'replace' Backbone.js的

Javscript

window.SourceListView = Backbone.View.extend({
    tagName:"li",
    template: _.template($('#tmpl_sourcelist').html()),

    initialize:function () {
        this.model.bind("change", this.render, this);
        this.model.bind("destroy", this.close, this);
    },

    render:function (eventName) {
        $(this.$el).html(this.template(this.model.toJSON()));
        return this;
    },

    close:function () {
        $(this.el).unbind();
        $(this.el).remove();
    }
});

HTML

 <script type="text/template" id="tmpl_sourcelist">
                        <div id="source">
                        <a href='#Source/<%=id%>'<%=name%></a>
                        </div>
                </script>

感谢

Answer 1

你在这里收到错误：

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

_.template内部的一部分涉及在生成编译模板函数的过程中对未编译的模板文本调用String#replace。这个特殊的错误通常意味着你有效地说出这个：

_.template(undefined)

如果您说#tmpl_sourcelist时DOM中没有$('#tmpl_sourcelist').html()，就会发生这种情况。

有一些简单的解决方案：

调整<script>订单，以便在尝试加载视图之前发现#tmpl_sourcelist。

在视图的initialize中创建已编译的模板函数，而不是在视图的“类”定义中：

window.SourceListView = Backbone.View.extend({
    tagName:"li",
    initialize:function () {
        this.template = _.template($('#tmpl_sourcelist').html());
        //...

就tagName而言，fine manual可以这样说：

el view.el

[...] this.el是根据视图的tagName，className，id和attributes属性创建的。如果没有， el 为空div。

所以在你看来有这个：

tagName: 'li'

表示Backbone将自动创建一个新的<li>元素作为您的视图el。

未捕获TypeError：无法调用undefined backbone.js的方法'replace'

1 个答案: