获得角度ui网格滚动事件

时间:2015-10-03 12:38:20

标签: angularjs angular-ui-grid

我正在尝试注册滚动事件(当出现新行时收到通知),如下所示:

 $scope.$on('ngGridEventRows', function (event, rows) {
            console.log("Scroll")
  });

但它不会发射..(angular ui-grid version:v3.0.6)

实现它的正确方法是什么?

3 个答案:

答案 0 :(得分:1)

我不确定他们的原生事件,但你可以为他们的滚动事件创建自己的观察者。

在这个Plunkr中,我制作了一个以滚动方式播放的观察者。

$scope.gridOptions.onRegisterApi = function(gridApi){
  $scope.gridApi = gridApi;
  $scope.$watch('gridApi.grid.isScrollingVertically', watchFunc);
  function watchFunc(newData) {
    if(newData === true) {
      $rootScope.$broadcast('scrolled');
    }
  }
};

你的接收器

app.controller('SecondCtrl', ['$scope', function ($scope){
  $scope.$on('scrolled', function(event, args) {
    console.log('was scrolled');
  });
}]);

Plunkr是从their Grid Scrolling教程创建的。

答案 1 :(得分:0)

如果您想要有关滚动的更准确数据(即实际滚动事件),您可以将网格包装在指令中。我不会在这里包含模板,因为链接配置是关键部分:

angular.module('my-app').directive('myGrid', function($timeout) {
    return {
      restrict: 'E',
      template: "<div><ui-grid></ui-grid></div>",
      link: function($scope, $element, $attributes) {
        $timeout(function() {
          $('div.ui-grid-viewport').on('scroll', function() {
            // Your event handling here
          });
        });
      }
    };
  });

答案 2 :(得分:0)

$scope.$watch("gridApi.grid.isScrollingHorizontally",function(){
//your code
});