Ag-Grid并禁用按钮 [英] Ag-Grid and disabling a button

问题描述

只要我的Ag-grid中未选择任何行，我想禁用按钮。选择一行后，我要激活一个按钮。这是我的代码：

I want to disable a button as long as any row is not selected in my ag-grid. When a row is selected I want to activate a button. Here my code:

app.component.html

app.component.html

<button disabled="activeButtons">Disable me</button> <!--option 1-->
<button ng-disabled="activeButtons()">Disable me</button> <!--option 2-->

<ag-grid-angular 
     #agGrid
     style="width: 500px; height: 500px;" 
     class="ag-theme-balham"
     [enableSorting]="true"
     [enableFilter]="true"
     [rowData]="rowData | async" 
     [columnDefs]="columnDefs"
     rowSelection="multiple">
</ag-grid-angular>

app.component.ts

app.component.ts

getSelectedRows() {
  const selectedNodes = this.agGrid.api.getSelectedNodes();
  return selectedNodes == null;
}

如何从getSelectedRows函数通知模板按钮？

How can I notify from the function getSelectedRows to my template button?

推荐答案

app.component.html

app.component.html

<button [disabled]="disableButtons">Disable me</button>

<ag-grid-angular 
     #agGrid
     style="width: 500px; height: 500px;" 
     class="ag-theme-balham"
     [enableSorting]="true"
     [enableFilter]="true"
     [rowData]="rowData | async" 
     [columnDefs]="columnDefs"
     rowSelection="multiple"
     (selectionChanged) = 'onSelectionChanged($event)'>
</ag-grid-angular>

app.component.ts

app.component.ts

onSelectionChanged(event: any){
  var selectedRows =  this.agGrid.api.getSelectedRows();
  this.disableButtons = selectedRows.length === 0;
}

这篇关于Ag-Grid并禁用按钮的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！