0

2つのファイルを作成しました。1つはid='search_template'でスクリプトが定義されているHTML用で、もう1つは「ビュー」について言及したjavaScriptファイルです。

ビューのレンダリング機能で、HTMLファイルのスクリプトを次のように取得しています。

id ='search_template'

jQueryを使用してjQueryに渡す

.html（）

文字列に変換してからアンダースコアに渡します

_.template（文字列）

ただし、アンダースコアはエラーをスローします

Uncaught TypeError：nullのメソッド'replace'を呼び出すことができません

jQueryはid='search_template'のスクリプトをStringに変換できないと思います。

SearchView = Backbone.View.extend({
      initialize: function(){
        _.bindAll(this, 'render');
      },
      render: function(){
        var template = _.template($("#search_template").html());
        $("body").html(template);
      }
    });
var search_view = new SearchView({ el: $("#search_container") });
    search_view.render();

レンダリング関数からjQuery部分を削除し、.html（）関数を使用せずにHTML文字列を明示的に渡してみました：-

render: function(){
    var template = _.template("<label><%= search_label %></label> 
    <input type=\"text\" id=\"search_input\" /> 
    <input type=\"button\" id=\"search_button\" value=\"Search\" />");
    $("body").html(template);
}

そして、これは完全にうまく機能します。$（ "search_template"）を使用してjQueryを使用してスクリプトを取得しているのに、なぜ機能しないのですか。また、HTMLファイルとJavaScriptファイルの両方をマージすると機能します。これがHTMLファイルからの抜粋です：-

<script type="text/template" id="search_template">
<label>Search here : </label>
<input type="text" id="search_input" />
<input type="button" id="search_button" value="Search" />
</script>
4

3 に答える 3

1

これrender：

render: function(){
  var template = _.template($("#search_template").html());
  $("body").html(template);
}

#search_template呼び出されたときにDOMにがないため、は機能していません。あなたが私を信じていないなら、ここにいくつかの証拠があります：http: //jsfiddle.net/ambiguous/HFYyx/

どこかにタイプミスまたはシーケンスの問題があります。

  1. HTMLに含めない場合は#search_template、HTMLを修正してください。
  2. render以前に実行#search_templateしているのがDOMにある場合は、render呼び出しを$(function() { ... })ラッパーに入れて、DOMの準備ができるまで呼び出されないようにします。
  3. にタイプミスがある場合は、タイプミスidを修正してください。

それらはあなたの問題の最も一般的な原因でしょう。

余談です_.templateが、関数を返します（2番目の引数も渡さない限り）。

レンプレート _.template(templateString, [data], [settings])

JavaScriptテンプレートを、レンダリング用に評価できる関数にコンパイルします。
[...]
1回限りの書き込みをしている場合は、テンプレート関数を返す代わりに、すぐにレンダリングするために、データオブジェクトを2番目のパラメーターとしてテンプレートに渡すことができます。

templateしたがって、戻り値をHTMLとして呼び出して使用する必要があります。

$('body').html(template());
// --------------------^^
于 2012-04-26T19:57:27.027 に答える
0

これを使って：

$(function() {
    var search_view = new SearchView({ el: $("#search_container") });
    search_view.render();
}
于 2012-07-17T07:40:20.440 に答える
0

テンプレート呼び出しと共にオブジェクトを渡す必要があるかもしれません:

var template = _.template($("#search_template").html(), { search_label: "Label1" });
于 2012-04-26T18:58:22.180 に答える