0

backbone.js では、データをフィルタリングする目的で、要素をクリックして取得しています。コレクションをnewcollectionとして保存しています。しかし、私はデータを取得できません。

私のコードの何が問題なのですか...

私のコード:

taskListPhraseI.collection = Backbone.Collection.extend({ // collection fetching
    model:taskListPhraseI.model,
    url : 'data/data.json',
  });

taskListPhraseI.allView = Backbone.View.extend({
    el:$('.boardHolder'),
    events:{
      'click span.green' : 'filterIt'
    },
    initialize:function(){
      var that = this;_.bindAll(this);
      this.collection = new taskListPhraseI.collection(); //initial stage i am fetching
      this.collection.fetch({success:that.render});

      this.on('change:filterType', this.setNewType); //on click trigger my custom method to get the collection again
      //this.on('reset:filterType', this.setNewType);
    },
    setNewType:function(){
      var newCollection = new taskListPhraseI.collection(); // my custom collection
      newCollection.fetch(); // fetching
      this.collection.reset(newCollection,{ silent: true }) // triggering rest
      var filterType = this.filterType,
            filtered = _.filter(this.collection.models, function (item) {
                return item.get("dueDays") === filterType;
            });
            console.log(newCollection.models); // not working... why?
            console.log(this.collection.models);// works

      this.collection.reset(filtered);
    },

または私が間違っている方法..コレクションをフィルタリングする

誰でも正しいプロセスの方法を教えてくれます...事前に感謝します

4

1 に答える 1

2

fetch非同期です。コレクションがフェッチされた後にコードを実行します

newCollection.fetch({context:this}).done(function() {
  // your code
})

さらに、これは正しいresetメソッドの使用法ではありません。

this.collection.reset(newCollection,{ silent: true })

次のように使用します。

this.collection.reset(newCollection.toJSON(), {silent:true})

EDIT（例を追加）

HTML 

<button>change filter</button>

JS

var url1 = 'https://api.twitter.com/1/statuses/user_timeline.json?screen_name=vpetrychuk&count=9'
var url2 = 'https://api.twitter.com/1/statuses/user_timeline.json?screen_name=derickbailey&count=9'
var collection = new (Backbone.Collection.extend({
    url : url1,
    resetWithFilter : function(key, value) {
      var query = {};
      query[key] = value;
      this.reset(this.where(query));
    }
}));

// fetch initial data
collection.fetch({dataType:'jsonp'});

$(':button').on('click', function() {
  // change url and fetch another data
  collection.url = url2;
  collection.fetch({dataType:'jsonp'}).done(function(response) {
      console.log('items count before filter:', collection.length);
    // now reset collection with selected filter
    collection.resetWithFilter('id_str', '294429621640912896');
    console.log('items count after filter:', collection.length)
  });
});

フィドル: http://jsfiddle.net/vpetrychuk/N4ZKm/

于 2013-01-24T13:19:27.653 に答える