事件处理函数不使用`this`关键字

Question

为什么我无法从事件处理程序中的this关键字获取数据以及如何修复它？

twittyApp.factory('Unshown', function () {
function Unshown() {
    this.allIsLoaded = false;
    this.loading = false;
    this.firstTime = true;
    this.scrollMarker = 100;
    this.loadedUnshownPages = 0;
    this.timeLineHiader = $cookies.get("lastReadedTweetId");
}
window.onscroll = function () {
     //why here this.scrollMarker is undefined?
};
return Unshown;
});

Answer 1

执行此更改

twittyApp.factory('Unshown', function() {

    var fact = {};

    function Unshown() {
        this.allIsLoaded = false;
        this.loading = false;
        this.firstTime = true;
        this.scrollMarker = 100;
        this.loadedUnshownPages = 0;
        this.timeLineHiader = $cookies.get("lastReadedTweetId");
    }

    var objUnShown = new Unshown();
    window.onscroll = function() {
        objUnShown.scrollMarker // aceess scrollmarker
    };

fact.Unshown =objUnShown;


    return fact.Unshown;
});

首先，您需要创建UnShown类的对象，然后才能访问其属性。

编辑2： 如果你想随时创建对象，你可以这样做。

twittyApp.factory('Unshown', function() {

        var fact = {};

        function Unshown() {
             ..
        }

        window.onscroll = function() {
            objUnShown.scrollMarker // aceess scrollmarker
        };

    fact.Unshown =Unshown;


        return fact;
    });

 /// in controller do this.

 var objUnshown = new Unshown.Unshown()

Answer 2

通过在this函数中使用Unshown关键字，您将设置该函数对象的属性。要访问函数外部的这些属性，请在函数对象引用上使用属性访问器。

twittyApp.factory('Unshown', function () {
function Unshown() {
    this.allIsLoaded = false;
    this.loading = false;
    this.firstTime = true;
    this.scrollMarker = 100;
    this.loadedUnshownPages = 0;
    this.timeLineHiader = $cookies.get("lastReadedTweetId");
}
window.onscroll = function () {
     //this.scrollMarker is undefined
     //
     //Use property accessor
     console.log(Unshown.scrollMarker);
};
return Unshown;
});

在AngularJS中使用window.onscroll

使用window.onscroll是Older way to register event listeners。

在AngularJS中，使用Angular's jqLite添加事件侦听器。

var windowElem = angular.element($window);

windowElem.on('scroll', function scrollListener (event) {
    console.log(event);
};

务必将$window添加到工厂功能的注射剂列表中。