12

私はbackbone.jsを使用して簡単なRSSアプリを開発しようとしています。私はこのbackbone.jsチュートリアルを使用しています。テンプレートを定義すると、2行目（テンプレート）で次のエラーが発生します。チュートリアルでtagName： "li"が定義されている理由を誰かに教えてもらえますか？

キャッチされないTypeError：未定義の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>

ありがとう

4

1 に答える 1

47

ここでエラーが発生します：

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れます。そうでない場合、elは空です。classNameidattributesdiv

だからあなたの見解でこれを持っている：

tagName: 'li'

<li>これは、Backboneがビューのとして新しい要素を自動的に作成することを意味しますel。

于 2013-02-12T06:02:01.837 に答える