0

一連のアイテムをフィルタリングできる Web アプリケーションがあり、Web フロントエンドで backbone.js を使用しているとします。

当然のことながら、Backbone.Modelを拡張するFilterとBackbone.Collectionを拡張するSearchResultListを作成することになりました。Filter には、 searchTerm、dataFrom、dateToなどの属性があります。Filter には というメソッドもあります。を呼び出して、検索結果を更新/フィルタリングする必要があります。applyFilterFilter.applyFiltersearchResultList.fetch

問題は、バックボーン用語の属性ではなく、プロパティsearchResultListとして最適に初期化する方法です。Filter

が によって「所有」されているとは限らないため、を作成したくSearchResultListありません。Filter.initializeSearchResultListFilter

今のところ、searchResultListオブジェクトをoptiontoとして渡すことになりましFilter.initializeたが、少しぎこちなく感じます。

Filter.applyFilterを呼び出すのは良い考えだとは思えませんSearchResultList.fetch。Filterただし、呼び出されたときに何らかの方法で新しいリクエストをトリガーするメソッドが必要です。(変更イベントをリッスンすることFilterもオプションではありません。ユーザーは複数のステップでフィルター オプションを変更する必要があり、ボタン クリックでフィルターを手動で適用することを決定するためです)

4

1 に答える 1

0

検索を実行するためのコレクションがあります。私のコレクションのほとんどは、この検索コレクションを拡張しています。

検索用のパラメーターを保持するオブジェクトが含まれています。コレクションのユーザーは を呼び出すことができsetSearchParam、呼び出す URL の検索部分を構築するメソッドbuildSearchStringがあります (REST URL で Matrix パラメーターを使用します)。

window.SearchCollection = Backbone.Collection.extend({

  initialize : function() {
    this.params = {}; // holds parameters for searching
  },

  // Set a search param
  setSearchParam: function(param, value) {
    if (typeof value === 'undefined') return;
    if (typeof this.params === 'undefined') this.params = {};

    this.params[param] = value;
  },

  setSearchParams : function(paramMap) {
    _.extend(this.params, paramMap);
  },

  // Build Matrix params for search. This could just as easily be a standard URL string
  buildSearchString: function() {
    var search = [];
    var i = 0;

    for (var key in this.params) {
       var value = this.params[key];
       if (utils.isEmpty(value)) continue;

       search[i++] = ";";
       search[i++] = key;
       search[i++] = "=";
       search[i++] = value;

    }
    return search.join('');
  }
});

次に、コレクションを作成するときに、それを拡張します。

window.BookingCollection = window.SearchCollection.extend({
    model: Booking,

    url: function(){

      var urlString = BASE_REST_URL + "bookings/";

      // Build the matrix params for the REST URL
      urlString += this.buildSearchString();

      return urlString;
    }

});

次に、このコレクションのユーザーは次のように使用できます。

var bookings = new BookingCollection();
bookings.setSearchParam("name", "hello");
于 2013-09-24T15:51:04.617 に答える