Ag-Grid需要刪除每行的按鈕

我正在嘗試使用Ag-Grid實現解決方案，而不是陷入一個問題。我試圖在每一行中實現編輯和刪除按鈕.edit按鈕實現成功，但問題在於刪除按鈕。我試圖盡我所知（這一點對角2）的。請參閱實施按下面的代碼： -Ag-Grid需要刪除每行的按鈕

court.component.ts

import { Component } from '@angular/core'; 
import { Court } from './court.model'; 
//import './../utils/array.extensions'; 

import { GridOptions } from "ag-grid"; 
import { DataCourtService } from '../services/data-court.service'; 
import { EditButtonComponent } from "../utils/editbutton.component"; 

@Component({ 
    selector: 'court', 
    template: require('./court.component.html'), 
    providers: [DataCourtService] 
}) 

export class CourtComponent { 
    private gridOptions: GridOptions; 
    public courts : Court[]; 
    onQuickFilterChanged(event: any) { 
    this.gridOptions.api.setQuickFilter(event.target.value); 
    } 
    constructor() { 
     var courtservice = new DataCourtService(); 
     this.gridOptions = { 
      rowSelection: 'single' 
     }; 

     // this.gridOptions.angularCompileRows = true; 
     this.gridOptions.columnDefs = [ 

      { 
       headerName: "Court Name", 
       field: "courtname",     
       editable: true 
      } , 
      { 
       headerName: "Action", 
       cellRendererFramework: EditButtonComponent, 
       colId: "edit" 
      } 

     ]; 

     this.gridOptions.rowData = courtservice.getCourt(); 

    } 
}

EditButton.component.ts

import {Component} from "@angular/core"; 
import {ICellRendererAngularComp} from "ag-grid-angular/main"; 

@Component({ 
    selector: 'edit-button', 
    template: `<button (click)="invokeEditMethod()" class="btn btn-primary btn-xs"><span class="glyphicon glyphicon-edit"></span>Edit</button> 
       <button (click)="invokeDeleteMethod()" class="btn btn-danger btn-xs"><span class="glyphicon glyphicon-remove"></span>Delete</button>` 
}) 
export class EditButtonComponent implements ICellRendererAngularComp { 
    public params: any; 

    agInit(params: any): void { 
     this.params = params; 
    } 
public invokeDeleteMethod() { 
     var selectedData = this.params.api.getSelectedRows(); 
     this.params.api.updateRowsData({remove: selectedData});   
    alert("hi"); 

} 
    public invokeEditMethod() { 


     this.params.api.setFocusedCell(this.params.node.rowIndex, 'courtname'); 
     this.params.api.startEditingCell({ 
     rowIndex: this.params.node.rowIndex, 
     colKey: 'courtname', 
     } 
    ); 
    } 

}

在此功能

public invokeDeleteMethod() { 
      var selectedData = this.params.api.getSelectedRows(); 
      this.params.api.updateRowsData({remove: selectedData});   
     alert("hi"); 

    }

我recieving一個錯誤UpdateRowData不是好玩ction。你能幫我實現這個嗎？

來源

2017-08-15 BlindSniper

仔細檢查你的拼寫..在你的代碼中你有更新*** *** ***數據，該功能應該沒有s –

同樣的錯誤。你確定？？？ – BlindSniper

@Jarod你是boslutely右拼寫不正確，但錯誤仍然存在 – BlindSniper

此功能在aggrid 10+中引入，我使用8 + .updating它解決了問題。

來源

2017-09-20 12:24:42 BlindSniper

Ag-Grid需要刪除每行的按鈕

回答

相關問題