ng-grid 的“beforeSelectionChange"相当于什么?在 ui 网格中? [英] Whats the equivalent for ng-grid's "beforeSelectionChange" in ui-grid?

问题描述

在ng-grid中，我曾经以如下方式使用beforeSelectionChange:

In ng-grid, I used to use beforeSelectionChange in the following way:

当用户选择一行时，执行一次ajax调用.当 ajax 调用发生时，我设置了 $scope.doingAjaxCall = true，并且为了防止用户更改选择，我在网格定义中有这个:

When the user selects a row, an ajax call is performed. While the ajax call is happenning I set $scope.doingAjaxCall = true, and to prevent the user from changing the selection, I had this in the grid definition:

beforeSelectionChange: function () {
    return !($scope.doingAjaxCall);
},

如果 ajax 调用发生，则锁定/冻结选择.

which locks/freezes the selection if the ajax call is happenning.

现在，在 ui-grid(又名 ng-grid 3)中，我不知道 afterSelectionChange 的等价物是什么.

Now, in ui-grid (aka ng-grid 3), I don't know whats the equivalent for afterSelectionChange.

在文档的这一部分:
http://ui-grid.info/docs/#/api/ui.grid.selection.api:PublicApi
我看到两个事件:

In this section of the documentation:
http://ui-grid.info/docs/#/api/ui.grid.selection.api:PublicApi
I see two events:

• rowSelectionChanges
• rowSelectionChangedBatch.

这些似乎相当于旧的 afterSelectionChange

在文档的这一部分:
http://ui-grid.info/docs/#/api/ui.grid.selection.service:uiGridSelectionService
我看这两个方法好像和需求有关:

And in this section of the documentation:
http://ui-grid.info/docs/#/api/ui.grid.selection.service:uiGridSelectionService
I see these two methods that seem to be related to the need:

• raiseSelectionEvent(grid, changedRows, event)
• decideRaiseSelectionEvent(grid, row, changedRows, event)

但我不明白如何使用它们

But I don't understand how to use them

重要说明:
我正在使用 multiSelect: false(即:只能选择一行)

Important note:
I'm using multiSelect: false (ie: only one row can be selected)

推荐答案

ui-grid 提供了执行此操作的工具，我不确定是否有ui-grid"方式，但肯定有办法做到这一点是兼容的.

ui-grid provides the tools to do this, I'm not sure there's a "ui-grid" way, but there are definitely ways to do it that are compatible.

根据你的描述，我假设你只允许单选，因为如果你允许多选，他们可以继续添加选择，你会在后台运行 ajax.所以我假设您正在根据 http:/设置 multiSelect: false/ui-grid.info/docs/#/tutorial/210_selection

Based on your description I'm assuming you are only allowing single selection, because if you allowed multiple selection they could keep adding selections and you'd run the ajax in the background. So I assume you're setting multiSelect: false per http://ui-grid.info/docs/#/tutorial/210_selection

我可以看到两种获得结果的方法:

I can see two ways to get the result:

1. 如果用户在 ajax 调用运行时尝试选择一行，请将选择设置回原来的位置.这意味着您必须监听 selectionChanged 和 selectionChangedBatch 事件，跟踪您想要的选择，并跟踪 ajax 调用何时进行.

1. If the user tries to select a row whilst an ajax call is running, set the selection back to where it was. This means you'd have to listen to the selectionChanged and selectionChangedBatch events, keep track of the selection that you want, and keep track of when an ajax call was in progress.

使用 isRowSelectable 函数，如果 ajax 调用正在运行，该函数不会选择任何行.该函数本身类似于您以前使用 ng-grid 所使用的函数，即 return !$scope.doingAjaxCall.不同之处在于，无论何时更改 $scope.doingAjaxCall 的值，都需要调用 notifyDataChange.从内存中使用户无法选择行仍将允许在代码中选择它 - 因此这不会改变该行已被选中.

Use an isRowSelectable function that doesn't let any row be selected if an ajax call is running. The function itself is similar to what you used to have with ng-grid i.e. return !$scope.doingAjaxCall. The difference is you need to call notifyDataChange whenever you change the value of $scope.doingAjaxCall. From memory making a row not selectable by the user will still allow it to be selected in code - so this won't change that the row is selected.

我可能会选择第二个选项.

I'd probably go with the second option.

按要求添加信息:isRowSelectable 位于上述教程中(有一个工作示例).唯一的技巧是我感觉它只会在特定事件上重新评估，因此当您更改 doingAjaxCall 变量时，它可能不会自动从每个项目中删除选择.因此我建议调用 notifyDataChange，这也在教程中.

Adding information as requested: isRowSelectable is in the tutorial as noted above (there's an example of it working). The only trick is that I have a feeling it's only re-evaluated on specific events, so it may not just automatically remove the select from each item when you change the doingAjaxCall variable. Hence I recommended calling notifyDataChange, which is also in the tutorial.

我建议您在 plunker 中尝试一下，然后如果您有困难，我可以查看并提供建议.我现在没有时间从头开始写.

I'd suggest you have a go at it in a plunker, and then if you have difficulty I can look and provide advice. I don't have the time right now to write it from scratch.

这篇关于ng-grid 的“beforeSelectionChange"相当于什么?在 ui 网格中?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！