web-dev-qa-db-ja.com

Backbone.jsがrenderでdivによるラップをオフにする

モデル投稿とコレクション投稿があります。そして、<select id="multi" multiple="multiple">のすべての投稿のリストを使用してフォームを作成したいと思います。したがって、このテンプレートだけを使用して、＃multi内にPostViewレンダリングを作成する必要があります。

<option value=""><%= title %></option>

しかし、最終的に私はそれをdivでラップします。このテンプレートを<div>でラップしないための解決策はありますか？

backbone.jsrender
23
BazZy

ビューのel（またはtagName）を（クラス内またはインスタンス化中に）定義しない場合、ビューはdivタグ内に配置されます。 http://documentcloud.github.com/backbone/#View-el

var PostView = Backbone.View.extend({
  tagName: 'option'
});

[〜＃〜]更新[〜＃〜]

V0.9.0以降、バックボーンにはこれを実行するためのview.setElement（element）があります。

var PostView = Backbone.View.extend({
    initialize: function() {
        var template = _.template('<option value=""><%= title %></option>');
        var html = template({title: 'post'});
        this.setElement(html);
    }
});
33
kreek

ビューでHTMLをラップさせたくない場合は、いくつかのことを行う必要があります。

  1. this.elを完全に置き換えます
  2. 新しいdelegateEventsでelを呼び出します
render: function(){
  var html = "some foo";
  this.el = html;
  this.delegateEvents(this.events);
}

Backboneは（ビューのdiv設定に基づいて）tagNameまたは他のタグを生成するため、完全に置き換える必要があります。それは簡単です。ただし、これを行うと、Backboneが内部でjQueryのdelegateを使用してイベントを接続するため、宣言されたイベントが失われます。宣言されたイベントを再度有効にするには、delegateEventsを呼び出して、イベント宣言を渡します。

その結果、view.elは必要な<option>タグになり、それ以上のものにはなりません。

18
Derick Bailey

バージョン0.9.0では、バックボーンはこの操作を処理するために view.setElement(element) を導入しました。

4
Stephen Watkins