暫時禁用 AG Grid (Angular) 中的行選擇

Question

我的網格如下（社區版），允許用戶 select 行（列定義上定義的復選框）

    <ag-grid-angular 
        *ngIf='!isLoading && model.length > 0'
        style="height: 70vh;" class="ag-theme-balham"
        [rowData]="model" 
        [animateRows]="true" 
        [gridOptions]="gridOptions" 
        [rowSelection]='rowSelection'
        [enableCellTextSelection]="true" 
        [overlayLoadingTemplate]="overlayLoadingTemplate"
        (cellDoubleClicked)="onCellDoubleClicked($event)"
        (selectionChanged)="onRecordSelected($event)" 
        (firstDataRendered)="onFirstDataRendered($event)"
        (gridReady)="onGridReady($event)">
      </ag-grid-angular>

頁面的一半顯示網格，另一部分是所選記錄的編輯。

在保存表單時，我想禁用網格中的選擇。 這可能嗎？ （也許我很愚蠢，但想不出辦法）

Answer 1

AG Grid文檔表明，對於行單擊選擇（如使用復選框選擇），您可以將suppressRowClickSelection設置為true以禁用選擇。

您可以在組件屬性中保存 boolean 值 - 例如。 suppressRowClick並在模板中設置suppressRowClickSelection等於suppressRowClick 。

您可以通過適合您項目的方法更新組件中的suppressRowClick ：

1. @Input() 來自父組件，或
2. 創建一個服務來管理suppressRowClick並從同級組件更新，或者
3. 使用像 NgRX 或 Akita 這樣的 state 管理框架（除非已經在使用，否則過度殺傷力）

Answer 2

似乎您想禁用整個網格禁用整個網格的一種方法是使用您已經在使用的疊加層，所以也許我誤解了這個問題。 如果您不想看到加載框，請在 html 中執行此操作：

   <ag-grid-angular
        #agGrid
        [overlayLoadingTemplate]="overlayLoadingTemplate"
...
 
    </ag-grid-angular>

在組件中設置

 overlayLoadingTemplate =
    '<span></span>';

然后在組件中使用此 function 來設置覆蓋，當您希望它被禁用時：

this.gridApi.showLoadingOverlay();

這對我有用，希望它可以幫助其他人。