webentwicklung-frage-antwort-db.com.de

AngularJS 'scrollTop' gleichwertig?

Ich möchte etwas Ähnliches in einer AngularJS-Direktive implementieren:

https://github.com/geniuscarrier/scrollToTop/blob/master/jquery.scrollToTop.js

Es ist ziemlich einfach, wenn Sie sich nicht oben auf der Seite befinden, wird eine Schaltfläche eingeblendet, um nach oben zu blättern:

 $(window).scroll(function() {
                if ($(this).scrollTop() > 100) {
                    $this.fadeIn();
                } else {
                    $this.fadeOut();
                }
            });

Es fällt mir jedoch schwer, den aktuellen Bildlaufort in Angular zu finden. Ich muss jQuery lieber nicht nur für diese eine Sache verwenden. 

Vielen Dank!

15
pram
$window.pageYOffset

Dies ist eine Eigenschaft aus dem Service-Fenster

33
Blaze

Ich glaube nicht, dass in Angular etwas ist, um die Bildlaufposition zu erhalten. Verwenden Sie einfach Vanilla JS.

Sie können die scrollTop-Eigenschaft für jedes Element abrufen.

https://developer.mozilla.org/en-US/docs/Web/API/Element.scrollTop

document.body.scrollTop

Geige für dich: http://jsfiddle.net/cdwgsbq5/

4
HaukurHaf

Wenn Sie das $ -Fenster in Ihren Controller einspritzen, können Sie die Bildlaufposition beim Scrollen ermitteln 

var windowEl = angular.element($window);
var handler = function() {
    console.log(windowEl.scrollTop())
}
windowEl.on('scroll', handler);

Fiddle

Anpassung von einer anderen stackoverflow Antwort

2
jetpackdata.com

Sie können verwenden 

angular.element(document).bind('scroll', function() {
    if (window.scrollTop() > 100) {
        $this.fadeIn();
    } else {
        $this.fadeOut();
    }
});
0
DMCISSOKHO

Sie können wie als polyfill verwenden hier ein link

function offset(Elm) {
  try {return Elm.offset();} catch(e) {}
  var rawDom = Elm[0];
  var _x = 0;
  var _y = 0;
  var body = document.documentElement || document.body;
  var scrollX = window.pageXOffset || body.scrollLeft;
  var scrollY = window.pageYOffset || body.scrollTop;
  _x = rawDom.getBoundingClientRect().left + scrollX;
  _y = rawDom.getBoundingClientRect().top + scrollY;
  return { left: _x, top: _y };
}
0
fulabel