Question

我想从选定的行中获取值并将其存储在数组中。当我取消选择一行时，我想将其从结果数组中删除。但是根据我的代码，我在该行上单击了多少次，因此将行值中的fileName添加到我的结果数组（selectedRows）中的次数很多。我的代码是：

HTML：

<ag-grid-angular #grid
      style="width : 603px; height:250px;" class="ag-theme-balham"
      [rowData]="searchResults" [columnDefs]="columnDefs" [rowSelection]="selectionMode"
      [rowMultiSelectWithClick] = true
      (rowClicked)="onRowClicked($event)"
    >
    </ag-grid-angular>

component.ts：

    export class ShowFilesComponent implements OnInit {
            searchResults : Array<String>;
            private seletectedRows :Array<String>;

            columnDefs  = [
                {headerName:"S No", valueGetter: (args) => this.getIndexValue(),checkboxSelection : true,headerCheckboxSelection: true,
                headerCheckboxSelectionFilteredOnly: true,cellRenderer: 'selectedClient'}, 
                {headerName : 'File Name', field:'fileName', sortable:true},
                {headerName : 'word count', field:'wordCount', sortable:true}
              ]
            constructor(private http: HttpClient,private r : Router, private s : FileListService) {
                this.http.get(this.path).subscribe(
                  (data: any) => {
                    this.searchResults = data;
                    console.log(this.searchResults);
                  },
                  error => console.log(error)
                );

               }
            }
            ngOnInit() {}
             onRowClicked(event){
            this.seletectedRows.push(event.node.data.fileName);

                console.log(this.seletectedRows);
}
        }

Answer 1

像这样使用 Array.prototype.push 方法：

onRowClicked(event){
    let temp = 0;
    this.seletectedRows.push(event.node.data.fileName);
    console.log(this.seletectedRows);
}

，然后取消选择使用 split 方法。我确定您的表/网格组件具有一些取消选择事件，可用于实现从数组中删除元素。

Answer 2

在网格上注册selectionChanged处理程序，并在您的处理程序中使用grid api的getSelectedNodes()方法。

<ag-grid-angular #grid
      [rowData]="searchResults" [columnDefs]="columnDefs" [rowSelection]="selectionMode"
      [rowMultiSelectWithClick]=true
      (selectionChanged)="onSelectionChanged($event)" >
</ag-grid-angular>

事件对象将具有对网格API的引用，您可以使用该API获取选定的行...

onSelectionChanged(event: AgGridEvent) {
  const nodes = event.api.getSelectedNodes();
  // now do something with them....
}

请注意，您不需要自己将节点存储在数组中-只需使用ag-grid的副本即可为您保持最新状态，那么您只需使用Array.map（）即可获取数组无论您要从节点数据中获取什么。

Answer 3

要收听该行的program Project1; var num1: integer; num2: integer; answer: integer; begin writeln('This program will accept two input values and raise the first number to the power of the second value'); writeln('Please enter the first number'); readln(num1); writeln('Please enter the second number'); readln(num2); writeln(num1**num2); end.，您需要注册selection/de-selection事件。

下面是来自onRowSelected论坛的示例代码，您可以在此基础上构建逻辑（下面的数据仅用于演示目的）

角度代码：

ag-grid-angular

Working example on plunkr

如何选择和取消选择角度6中的行

3 个答案: