角度js滚动指令不起作用

时间:2018-08-18 14:45:44

标签: javascript angularjs scroll angularjs-directive

我正在尝试执行angular(1.3.14)指令来处理此类元素上的滚动事件

var app = angular.module('myApp', []);

app.directive("scroll", function ($window) {
    return {
      restrict: 'A',
      link: function(scope, element, attrs) {
          console.log(element.className); // return 'undefined'
          element.on('scroll', function(e) {
            console.log('scroll'); //not working
          });
          element.on('click', function(e) {
            console.log('click'); //working
          });
      }
    }
});

我的问题是滚动事件不会触发。其他所有事件(例如单击)均正常运行,但滚动不正常。另外,当我尝试获取元素的类时,我得到“未定义”,并且我的元素具有类。它是html:

<body ng-app="myApp" ng-controller="myCtrl" ng-keydown="keyListener($event)">
    <section class="dark content second" scroll="">         
    </section>
</body>

我不知道这里有什么问题。

2 个答案:

答案 0 :(得分:2)

您的指令是正确的,我已经在您的部分中对内部div进行了测试,并使用了一些类使其可滚动

<section class="dark content second" scroll="">
  Hi         
  <div class="internal">
    Something
  </div>
</section>

CSS

    .second{
      background-color: red;
      max-height: 150px;
     overflow-y:scroll;
    }

   .internal{
      height: 200px;
    }

该活动非常完美!您只需要使<section>可滚动或在body / html标记中应用指令即可。这是我测试过的http://plnkr.co/edit/hp2BbnLeGjtwIbfi2mqZ?p=preview

的Plunker示例

答案 1 :(得分:0)

尝试一下

String