Tengo una gran variedad de artículos en mi Modelo y se representan muy bien como HTML. Lo que quiero es agregar algunos artículos nuevos cuando el usuario se desplaza hasta el final de la página. Logré esto, pero en mi opinión con un comportamiento realmente hacky: todo lo que he hecho es agregar el controlador de eventos jquery$(window).scroll, Me gusta esto:

function ArticlesViewModel() {
    var self                = this;
    this.listOfReports      = ko.observableArray([]);

    this.loadReports = function() {
        $.get('/router.php', {type: 'getReports'}, function(data){
            self.listOfReports(self.listOfReports().concat(data));
        }, 'json');
    };

    this.loadReports();

    $(window).scroll(function() {
        if($(window).scrollTop() == $(document).height() - $(window).height()) {
            self.loadReports();
        }
    })
};

En mi escenario de prototipo simple funciona bien, pero creo que este desplazamiento se llamará incluso si oculto mi modelo.

Entonces, ¿hay una manera más apropiada de hacer el mismo comportamiento?