AngularJS - ＆GT;对于＆QUOT查询;在网页＆QUOT的底部; [英] AngularJS -> Query for "is at bottom of page"

问题描述

什么是要求最好的办法有没有更多的滚动或有我们到达角滚动区域的底部？

What is the best way to ask "Is there more to scroll or have we reached the bottom of the scrollable area in Angular?"

有一个固定的底部导航栏单页的应用程序，并想显示表明有要显示更多的内容，就不是在页面末有条件的UI提示。有（哈希标签）思考是一个书签的方式来做到这一点。

Have a single page app with a fixed bottom navbar and want to display a ui cue indicating that there is more content to be displayed, conditional on not being at end of page. Thinking there is a bookmark way (hash tag) to do this.

推荐答案

下面是一种解决方案：我已经创建指令结合的滚动事件，并在它的情况下可以向下滚动显示它的div，附加在编译的时候

Here is kind of solution: I've created directive that bind scrolling event and in case of it is possible to scroll down it show div, appended in compile time:

app.directive('thereIsMore', function() {
  return {
    restrict: 'A',    
    scope: true,
    compile: function(tElement) {
      tElement.append('<div class="there-is-more" ng-show="bottom">There is more...</div>');
      return function(scope, element) {
        var elm = element[0];        
        var check = function() {
          scope.bottom = !(elm.offsetHeight + elm.scrollTop >= elm.scrollHeight);
        };
        element.bind('scroll', function() {
          scope.$apply(check);          
        });
        check();        
        }; // end of link 
    }    
  };
});

的例子：<一href=\"http://plnkr.co/edit/8W3E7BunpDxIkEPDqxzb?p=$p$pview\">http://plnkr.co/edit/8W3E7BunpDxIkEPDqxzb?p=$p$pview

这篇关于AngularJS - ＆GT;对于＆QUOT查询;在网页＆QUOT的底部;的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！