Scroll-Ereignis wird nicht innerhalb von directory - angular.js ausgelöst

Ich bin stucked mit dem problem. Ich habe eine Richtlinie für die infinite-scroll-wo höre ich für scroll Veranstaltung. Das problem ist, dass die scroll-Ereignis wird nur gefeuert, wenn ich mich verbindlich zu $window:

angular.element($window).bind('scroll', function () {
  console.log('Gogo!'); //works!
});

element.bind('scroll', function () {
  console.log('Gogo!'); //doesn't work... :(((
});

Richtlinie ist innerhalb ng-view ich fand diese Frage, sieht sehr ähnlich wie mein problem - Die Bindung an Ereignisse, die in einer Richtlinie, die in eine ng-view funktioniert nicht

Jemand weiß, wie man dieses Problem lösen? Danke!

Meine Richtlinie:

directives.directive('scrolly', function () {
    return {
        restrict: 'A',
        link: function (scope, element, attrs) {
            var raw = element[0];

            element.bind('scroll', function () {
                if (raw.scrollTop + raw.offsetHeight > raw.scrollHeight) {
                    scope.$apply(attrs.scrolly);
                }
            });
        }
    };
});

Meiner Sicht:

<ul class="items-wrap" scrolly="showMore()">
   <li class="item" ng-repeat="item in items">{{item.name}}</li>
</ul>

InformationsquelleAutor der Frage Kosmetika | 2014-02-24

  1. 12

    Habe ich eine Geige für Sie hier: http://jsfiddle.net/ADukg/4831/

    Das interessante an der Sache ist, dass ich Ihre genauen code, und alles auszulösen scheint in Ordnung (siehe alle übersät console.log() Anrufe). Ich vermute dein problem hat mit deinem CSS-styling, obwohl, so ohne die richtige Verwendung von overflow, ich konnte nicht Holen Sie das scroll-Ereignis ausgelöst.

    InformationsquelleAutor der Antwort Matt Way

  2. 27

    Ist es wahrscheinlich, weil das element Sie sind verbindlich, um nicht "scrollen".

    Den Knoten, dass Sie tatsächlich scrollen (das Dokument, oder vielleicht ein div mit scroll-overflow), ist die eine Sache, dass eigentlich das Ereignis ausgelöst.

    Versuchen, die Injektion $document in Ihrer Richtlinie und der Einrichtung des scroll-Ereignis auf:

    $document.bind('scroll', function (){});

    Außerdem Graben die if-Anweisung auf der Innenseite des handlers, bis Sie sicher sind, dass Sie das Ereignis auslösen richtig dann fügen Sie es zurück.

    Nur um zu starten:

    app.directive('scrolly', function ($document) {
    return {
        restrict: 'A',
        link: function (scope, element, attrs) {

            $document.bind('scroll', function () {
                scope.$apply(attrs.scrolly);
            });
        }
    };
});

    Dann Ihre Arbeit in der Untersuchung der Positionierung der Elemente und andere Logik.

    Ich hoffe, das hilft.

    InformationsquelleAutor der Antwort Ben Lesh

Schreibe einen Kommentar