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

Question

我正在尝试使用backbone.js开发一个简单的RSS应用程序.我正在使用这个backbone.js 教程.在定义模板时,我在第2行(模板)上收到以下错误.有人也可以告诉我为什么tagName:"li"在教程中定义？

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

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().

有一些简单的解决方案:

1. 调整<script>订单,以便#tmpl_sourcelist在尝试加载视图之前进行调整.

2. 在视图中创建已编译的模板函数,initialize而不是在视图的"类"定义中:

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

到目前为止tagName,精细的手册有这样的说法:

埃尔 view.el

[...] this.el是从视图的创建tagName,className,id和attributes属性,如果指定.如果没有,el是空的div.

所以在你看来有这个:

tagName: 'li'

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