微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

angularjs – 如何滚动ngGrid以显示当前选择?

我正在从 JavaScript设置我的ngGrid选择,调用gridOptions.selectItem().我有multiSelect设置为false,所以只有一行被选中.我希望ngGrid自动滚动显示新选择的行,但是我不知道该怎么做:任何人都可以帮忙吗?

关于相关主题:可以通过鼠标点击来禁用行选择吗?如果是这样,怎么办?

编辑添加

如果可能,我也想禁用所选行的键盘导航.

有什么工作

AardVark71的答案工作.我发现ngGrid在gridOptions变量上定义了一个属性ngGrid,它保存对网格对象本身的引用.必要的功能通过此对象的属性来暴露:

$scope.gridOptions.selectItem(itemNumber,true);
$scope.gridOptions.ngGrid.$viewport.scrollTop(Math.max(0,(itemNumber - 6))*$scope.gridOptions.ngGrid.config.rowHeight);

我的网格固定为13行高,我的逻辑尝试使选定的行出现在网格的中间.

我还是想禁用鼠标&如果可能,键盘更改为选择.

什么也有效:

这可能更接近于“角色之路”,并达到同样的目的:

// This $watch scrolls the ngGrid to show a newly-selected row as close to the middle row as possible
$scope.$watch('gridOptions.ngGrid.config.selectedItems',function (newValue,oldValue,scope) {
            if (newValue != oldValue && newValue.length > 0) {
                var rowIndex = scope.gridOptions.ngGrid.data.indexOf(newValue[0]);
                scope.gridOptions.ngGrid.$viewport.scrollTop(Math.max(0,(rowIndex - 6))*scope.gridOptions.ngGrid.config.rowHeight);
            }
        },true);

虽然通过点击选择行的效果可能会令人不安.

听起来你可以使用scrollTop方法来滚动.

另见http://github.com/angular-ui/ng-grid/issues/183和以下来自@ bryan-watts http://plnkr.co/edit/oyIlX9?p=preview的plunker

这个例子可以如何工作如下:

function focusRow(rowToSelect) {
  $scope.gridOptions.selectItem(rowToSelect,true);
  var grid = $scope.gridOptions.ngGrid;
  grid.$viewport.scrollTop(grid.rowMap[rowToSelect] * grid.config.rowHeight);
}

编辑:

对于您的问题的第二部分“禁用所选行的鼠标和键盘事件”,最好开始一个新的问题.听起来你想要将enableRowSelection动态设置为false?不知道如果这是可能的.

原文地址:https://www.jb51.cc/angularjs/140665.html

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。

相关推荐