2011-10-12 15 views
0

私は内部的にBackbone.jsを使用するjQueryウィジェットに取り組んでいます。
ここではコレクションがモデルを作成し、ビューには、独自のサブビューを作成します。Backbone.jsクラス内のjQueryウィジェットのインスタンスプロパティにアクセスする方法は?

Serializer = function(options, element){ 
    this.element = element; 
    this.data = options.data; 
    this.collection = new Serialize.Collection(this.data); 
    this.view = new Serialize.View({ el: this.element, collection: this.collection }); 
}; 

$.widget.bridge("serialize", Serializer); 

$.widget.bridgeは(ここでは@varsがレールによって設定されている)のウィジェットのインスタンスを作成し、オプションで渡すための友好のラッパーを提供します。

$('#item').serialize({ 
    data: <%= @data %>, 
    name: '<%= @name %>', 
    keys: '<%= @keys %>' 
}); 

後で作成されるモデルとビューでは、ウィジェットインスタンスのオプションにアクセスする必要があります。私はこれまでのコレクション自体のオプションを設定することで、これを解決:

this.collection = new Serialize.Collection(this.data, options); 

以降、彼らが必要とされる場所(例えばビューで)それらを参照:

var keys = this.model.collection.keys 

しかし、これは厄介取得していませんその柔軟性。

単一インスタンスの場合、Serialize.Config = { // options }を設定して、グローバルにアクセスできます。しかし、複数のインスタンスの場合、各インスタンスにはそれぞれ独自の設定が必要です。

私の質問は、引数として渡すことなく、Backboneクラス内のウィジェットインスタンスとそのオプションにアクセスするきれいな方法があるかどうかです。

答えて

1

ウィジェットに渡すオプションに基づいて各ウィジェットインスタンスをレンダリングしたいかのようです。

Backbone.js通常、これらのオプションを保存するのに適しています。特にウィジェットごとに1つのビューがあるためです。

このように、私は次の操作を行います:

Serializer = function(options, element){ 
    // add DOM node and collection to the options hash 
    options.el = element; 

    // create view and pass options 
    this.view = new Serialize.View(options); 
}; 

あなたは(おそらくthis.view.render()付き)ウィジェットをレンダリングするとき、あなたがSerializerに渡されたすべてのオプションにアクセスできます:

Serialize.View = Backbone.View.extend({ 
    initialize: function() { 
     // create collection 
     this.collection = new Serialize.Collection(this.options.data); 

     // register events if needed 
     this.collection.bind('add', this.render_one_element_of_the_collection); 
     this.collection.bind('fetch', this.render_whole_collection); 
    }, 

    render: function() { 
     var data = this.options.data; 
     var keys = this.options.keys; 
     // etc 

     // do something with your variables 

     return this; 
    } 
}); 
+0

を感謝し、その良いアプローチのようだ。私は、すべてを初期化するウィジェットのインスタンスに対応する1つのマスタービューというアイデアが気に入っています。私はおそらく、マスタービューの中でコレクションを作成することも考えていますが、それはちょっとした「始まり」を感じ始めると思っています:) – meleyal

+0

実際、それはもっとクリーナーにもなります!コレクションはマスタービューの一部であるため、そこに安全に作成できます。それに応じて上記のスクリプトを変更してください。 – poezn

関連する問題