Question

例如，如果我点击第1行上的“+”符号然后点击第2行上的“+”符号，则必须关闭第1行，并且必须展开第2行。

这是我用于ui-grid的代码

<div ui-grid="gridOptions" ui-grid-pinning ui-grid-expandable class="grid" ui-
pagination>

Answer 1

您可以为rowExpandedBeforeStateChanged事件定义一个侦听器，如下所示：

vm.gridApi.expandable.on.rowExpandedStateChanged(null, function (row) {

如果某一行已展开，您可以遍历所有展开的行并折叠任何与刚刚展开的行的hashKey不匹配的行。实际上，由于这个逻辑，应该只有两个扩展的行 - 先前扩展的行和新扩展的行。

您可以在rowExpandedStateChanged事件中使用这样的逻辑：

    if (row.isExpanded) {
      collapseAnyPreviouslyExpandedRow();
    }

    function collapseAnyPreviouslyExpandedRow() {
      var expandedRows = vm.gridApi.expandable.getExpandedRows();
      if (expandedRows.length > 1) {
        angular.forEach(expandedRows, function (expandedRow, key) {
          if (expandedRow.$$hashKey !== row.entity.$$hashKey) {
            vm.gridApi.expandable.collapseRow(expandedRow);
          }
        });
      }
    }

这假设您之前已使用onRegisterApi调用向控制器分配了gridApi对象，如下所示：

  vm.yourGridConfigObject.onRegisterApi = function (gridApi) {
    vm.gridApi = gridApi;

ui-grid一次可扩展一个

1 个答案: