el骨干视图问题

时间:2014-05-08 15:08:01

标签: backbone.js

我不明白为什么在我的视图中el只被定义到loadResults函数而不是checkScroll ...可能依赖于documentAddEventLIstener(“scroll”,this.checkScroll,this)? 我无法理解原因

    var HomePostView = Backbone.View.extend({

    tagName: "ul",
   // id: "list",
   // el:$('.table-view'),
    template: Handlebars.compile(template),

    events: {
    'scroll': 'checkScroll'
     },



    initialize: function () {
   //console.log(this.collection);
    // this.collection.bind("add", this.render, this);

     document.addEventListener("scroll", this.checkScroll, this);
     this.isLoading = false;
     this.IntegratedCollection= new Integrated();
     this.IntegratedCollection.twitterQuery=11265832;//spostare in load results
      this.IntegratedCollection.fetch();
     this.listenTo(this.IntegratedCollection,'add',this.render);

      console.log((this.el));

    },



    render:function(){

        this.loadResults();
    },






    loadResults: function (eventName) {
   console.log((this.el));<-----WELL DEFINED HERE
    this.isLoading = true;
      $(this.el).empty();
      _.each(this.IntegratedCollection.models, function (a) {
        $(this.el).append(new SingleHomePostView({
          model: a
        }).render().el);
      }, this);
      this.isLoading = false;
      return this;


    },

    setParameters: function(){

        this.IntegratedCollection.page += 1; // Load next page
      this.IntegratedCollection.twitterQuery=11265832;
      this.IntegratedCollection.fetch();




    },

     checkScroll: function () {


        console.log(this.el);<-----UNDEFINED HERE
  var triggerPoint = 100; // 100px from the bottom
    if( !this.isLoading && this.el.scrollTop + this.el.clientHeight + triggerPoint > this.el.scrollHeight ) {
        console.log("inside");
     // this.setParameters();
      //this.loadResults();

    }
    }





  });

2 个答案:

答案 0 :(得分:2)

我认为你的这个&#39;指向窗口对象。试试

that = this;//In initialize

并在checkScroll中使用that代替this

答案 1 :(得分:0)

正因为如此:

document.addEventListener("scroll", this.checkScroll, this);

DOM addEventListener函数确实有三个参数,但第三个参数不是上下文参数,它是一个布尔值,告诉它是否在事件传播的捕获阶段处理事件。相反,您可以使用适当的上下文绑定事件处理程序:

document.addEventListener("scroll", this.checkScroll.bind(this));