javascript - ui-grid,滚动时出错

标签 javascript angularjs angular-ui-grid

当我在 ui-grid 中滚动时出现以下错误:

Uncaught TypeError: Cannot read property 'percentage' of undefined

有趣的是,我在 ui-grid 教程网站上遇到了同样的错误,所以这可能只是一个错误。

这是一个显示 issue 的插件.

这是我使用的网格选项:

mc.gridOptions = {
    data: mc.people,
    enableSorting: true,
    onRegisterApi: function( gridApi ) {
      mc.gridApi = gridApi;
    },
    columnDefs: [
      {field: 'name'},
      {field: 'age'},
      {field: 'state', enableSorting: false}
    ]
  };

关于我在这里做错了什么有什么想法吗?据我所知,这没有任何问题。

最佳答案

我会在评论框中提及这一点,但我需要空格和格式来说明您可能需要引起他们的注意:

首先,您使用的是不稳定版本,最好的办法是使用正在使用和测试的稳定版本。

不稳定的版本在下面的代码中引发了一个错误。请查看我在星号 (******) 中的所有评论:

// Scroll the render container viewport when the mousewheel is used
$elm.bind('wheel mousewheel DomMouseScroll MozMousePixelScroll', function(evt) {
  // use wheelDeltaY

  var newEvent = GridUtil.normalizeWheelEvent(evt);

  var args = { target: $elm };

  *****THIS STATEMENT IS TRUE BECAUSE YOU SCROLLED VERTICALLY, ARGS.Y IS SET*****
  if (newEvent.deltaY !== 0) {
    var scrollYAmount = newEvent.deltaY * -120;

    // Get the scroll percentage
    var scrollYPercentage = (containerCtrl.viewport[0].scrollTop + scrollYAmount) / rowContainer.getVerticalScrollLength();

    // Keep scrollPercentage within the range 0-1.
    if (scrollYPercentage < 0) { scrollYPercentage = 0; }
    else if (scrollYPercentage > 1) { scrollYPercentage = 1; }

    ***THIS IS SET***
    args.y = { percentage: scrollYPercentage, pixels: scrollYAmount };
  }

  *****THIS STATEMENT IS FALSE BECAUSE YOU NEVER SCROLLED HORIZONTALLY, ARGS.X IS NOT SET*****
  if (newEvent.deltaX !== 0) {
    var scrollXAmount = newEvent.deltaX * -120;

    // Get the scroll percentage
    var scrollLeft = GridUtil.normalizeScrollLeft(containerCtrl.viewport);
    var scrollXPercentage = (scrollLeft + scrollXAmount) / (colContainer.getCanvasWidth() - colContainer.getViewportWidth());

    // Keep scrollPercentage within the range 0-1.
    if (scrollXPercentage < 0) { scrollXPercentage = 0; }
    else if (scrollXPercentage > 1) { scrollXPercentage = 1; }

    ***THIS DOESNT GET SET SINCE IT WILL NOT REACH THIS POINT***
    args.x = { percentage: scrollXPercentage, pixels: scrollXAmount };
  }

  *****THROWS AN ERROR BECAUSE ARGS.X IS NULL & DOESNT EXIST*****
  // Let the parent container scroll if the grid is already at the top/bottom
  if ((args.y.percentage !== 0 && args.y.percentage !== 1) || (args.x.percentage !== 0 && args.x.percentage !== 1)) {
    evt.preventDefault();
  }

  uiGridCtrl.fireScrollingEvent(args);
});

关于javascript - ui-grid,滚动时出错,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/27807439/

相关文章:

angularjs - 链接函数中的element.replaceWith

angularjs - $$animateJs 在使用 oclazyload、uigrid 和 nganimate 时不是函数

javascript - 需要根据外部下拉列表中的列名称单独获取 ui 网格列数据

javascript - 现在如何使用 firebase.firestore.FieldValue.serverTimestamp()?

JavaScript:使用自动热键登录网站

angularjs - 父 > 子动画意外 - 不同的 Angular 1.3 到 1.4

javascript - 如何在 Angular js中将一个表行移动到另一个表?

angularjs - 如何从 $http 请求中获取数据以显示在 Angular ui.grid 中

javascript字符串连接到jquery选择器

javascript - Angular 中仅处理最新异步请求的响应的模式?