0

特定の期間 (ビューから呼び出された) の後にバックボーン コレクション (「投稿」) の状態変数を切り替えようとしており、setTimeout を使用しようとしています。ただし、トグル機能が機能していないため、スコープを台無しにしていると思います（呼び出されていますが、適切に変更されていません）。

私が使用する場合 

setTimeout(this.model.collection.toggleReadyToPreloadNewPost, 1000);

、コードが機能しませんが、使用すると

this.model.collection.toggleReadyToPreloadNewPost();

正しく切り替えます。どうすればこれを解決できるのだろうか？

バックボーン ビュー

//ensures namespace is not already taken yet
wedding.views = wedding.views || {};

//each PostView corresponds to a single post container 
//which contains the user name, user comment, and a photo
wedding.views.PostView = Backbone.View.extend({

  tagName: "li",
  template: "#item-template",
  className: "hideInitially post",

  initialize: function() {
    _.bindAll(this);
    this.template = _.template($(this.template).html());
  },

  render: function() {
    this.preload();
    return this;
  },

  //preloads an image and only after it is done, then append
  preload: function() {
    var image = new Image(); 
    image.src = this.model.get("src");
    this.model.incrementTimesSeen();

    //hides the element initially, waits for it to finish preloading, then slides it down
    //updates lastSeen only after the image is displayed
    image.onload = $.proxy(function() {
      var html = this.template( {model: this.model.toJSON()} );

      this.model.setLastSeen();

      //shows the image by sliding down; once done, remove the hideInitially class
      this.$el.hide().append(html).slideDown();
      this.$el.removeClass("hideInitially");

      setTimeout(this.model.collection.toggleReadyToPreloadNewPost, 1000);
    }, this);
  }

});

バックボーン コレクション

//check if namespace is already occupied
wedding.collections = wedding.collections || {}; 

wedding.collections.Posts = Backbone.Collection.extend({
  model: wedding.models.Post,

  initialize: function() {
    this.readyToPreloadNewPost = 1;
  },

  //toggles "readyToPreloadNewPost" between 1 and 0 
  toggleReadyToPreloadNewPost: function() {

    this.readyToPreloadNewPost = this.readyToPreloadNewPost ? 0 : 1;
  }    
});
4

1 に答える 1

2

これを行う場合:

setTimeout(this.model.collection.toggleReadyToPreloadNewPost, 1000);

setTimeout単純なバインドされていないtoggleReadyToPreloadNewPost関数を処理しているだけsetTimeoutで、それを単純な関数として呼び出します。結果は、関数を呼び出すときに内部にthisなります。windowtoggleReadyToPreloadNewPostsetTimeout

thisメソッド呼び出しを無名関数でラップすることで、権利を得ることができます。

var _this = this;
setTimeout(function() {
    _this.model.collection.toggleReadyToPreloadNewPost();
}, 1000);

次のものも使用できます_.bind。

setTimeout(
    _(this.model.collection.toggleReadyToPreloadNewPost).bind(this.model.collection),
    1000
);

_.bindAllコレクション内で使用initializeして、そのメソッドを常に適切な にバインドすることもできますthis。

wedding.collections.Posts = Backbone.Collection.extend({
    initialize: function() {
        _.bindAll(this, 'toggleReadyToPreloadNewPost');
        //...
    }

そして、あなたのオリジナル

setTimeout(this.model.collection.toggleReadyToPreloadNewPost, 1000);

正しいことをするべきです。常に拘束されたい場合にのみ、このルートtoggleReadyToPreloadNewPostに行きたいと思うでしょう。

于 2012-12-12T08:35:46.333 に答える