Как я могу программно выбрать несколько строк в ag-Grid?

У меня есть массив идентификаторов строк, хранящихся в tempSelected, и я хотел бы программно установить каждую строку в списке как выбранную. Вот что я пытаюсь:

let len = tempSelected.length;
this.gridApi.forEachNode(function (node) {
  for(let i=0; i<len; i++){
    if(node.id === tempSelected[i]){
      node.setSelected(true);
    }
  }
});

В конце этого цикла я хочу, чтобы была выбрана каждая строка в tempSelected, но прямо сейчас выбирается только последний идентификатор в массиве tempSelected, а остальные - нет.

Я установил rowSelection = 'multiple', поэтому не следует ограничиваться одним выбором. Я также попытался изменить node.setSelected(true); на node.setSelected(true, false); на основе того, что я прочитал здесь, на веб-сайте ag-grid, но результат не изменился.

Как я могу выбрать сразу несколько узлов?


typescript angular ag-grid ag-grid-angular
person Matt123    schedule 10.10.2019    source источник
comment
Тип node.id совпадает с типом данных tempSelected?   -  person Aamir    schedule 10.10.2019
comment
@Aamir Да, я помещаю в этот оператор if оператор console.log, и когда tempSelected имеет 3 значения, журнал печатается 3 раза.   -  person Matt123    schedule 10.10.2019
comment
Это странно, я делал что-то подобное, и это работает, просто для подтверждения, вы устанавливаете gridOptions.rowSelection = 'multiple'?   -  person Aamir    schedule 10.10.2019

Ответы (1)


arrow_upward
3
arrow_downward

Я предполагаю, что это связано с тем, что вы обработали выделение строк в хуке жизненного цикла ngOnInit или событии gridReady ag-grid. Оба события не подходят, поскольку ловушка ngOnInit запускается после завершения инициализации, а gridReady запускается, когда сама сетка готова (но данные еще не отрисованы).

Следовательно, на всякий случай и при условии, что вы хотите обрабатывать выделение при загрузке, вы должны вместо этого использовать событие firstDataRendered.

В вашем случае вы можете привязать событие firstDataRendered к какому-либо методу, например onFirstDataRendered. Кроме того, убедитесь, что rowSelection привязан к multiple, чтобы разрешить множественный выбор.

<ag-grid-angular
  (firstDataRendered)="onFirstDataRendered($event)"
  [rowSelection]="'multiple'"

  // other events and props
></ag-grid-angular>

И на вашем component.ts,

onFirstDataRendered(params) {
  let len = tempSelected.length;
  this.gridApi.forEachNode(node => {
    for (let i=0; i<len; i++) {
      if(node.id === tempSelected[i]){
        node.setSelected(true);
      }
    }
  });
}

Я создал демонстрацию здесь.

person wentjun    schedule 12.10.2019