web-dev-qa-db-ja.com

バックボーンが周囲のdivをビューに追加しないようにしますか？

Backbone.jsアプリのテンプレートツールとしてHandlebars.jsを使用しています。ビューのレンダリング関数は通常、次のようになります。

  var source = $("#round").html();
  var template = Handlebars.compile(source);
  var context = JSON.parse(JSON.stringify(this.model));
  var html = template(context);
  $(this.el).html(html);
  return this;

上記は、次のコード（これは上記のコードを呼び出すコードです）を介してメインアプリビューに追加されます。

$('div#round-container', this.el).append(roundView.render().el);

私のHandlebarsテンプレートはすべてのスタイリングとレイアウトを処理するので、ビューの「el」要素は空白のままにします。 Backbone.jsは、Handlebarsテンプレートの周囲に周囲のdivタグを自動的に追加します。これは、「el」要素が空白であるためだと思います。周囲のdivタグの追加を防ぐ方法はありますか？ありがとう！

javascriptbackbone.js
27
egidra

何が起こっているのかというと、_this.el_はあなたが明示的に設定したことがないため、その場で作成されます。 2つのオプションがあります。

  1. 作成する要素をtagName、className、またはidで指定し、バックボーンに作成させる必要があります。

  2. renderで、_this.el_をハンドルバーテンプレートのコンテンツに設定する必要があります。したがって、this.el = $(template(context))があります。

ドキュメントには拡張された説明があります- http://documentcloud.github.com/backbone/#View-el

41
Caged

もう1つの簡単な方法は、代わりにレンダリングされた要素の子ノードを追加することです。

$('div#round-container', this.el).append(roundView.render().el.childNodes);
5
Sandeep Kashyap

または、レンダリングされた要素のhtmlを追加します。例：

$('div#round-container', this.el).append(roundView.render().el.html());
3
Pinelopi Kouleri