Как обнаружить изменения в ag-grid, когда мои данные строки обновляются при передаче от одного компонента к другому

Я работаю над проектом на angular6, и мы внедряем ag-grid для заполнения данных из углового диалогового окна. Поскольку работают несколько команд, поэтому они создают собственный компонент. Я застрял в одной из необычных ситуаций и не могу понять, как разрешить ситуацию. У нас есть кнопка с именем (ADD OWNER), которая является компонентом с именем ADD-OWNER.component.ts, где я открываю диалоговое окно и передаю другой компонент с именем ownerdetails.component.ts, в котором есть все данные формы. В диалоговом окне есть 2 кнопки (ДОБАВИТЬ / ОТМЕНИТЬ), так что я помещаю данные в службу метаданных, поскольку мне не нужно сохранять данные в базе данных, я должен хранить данные в браузере. Та часть кодирования, которую я сделал в событии dialog.closed, работает нормально. Теперь мне нужно передать детали этого владельца в другой компонент, называемый Gridcomponent, где моя ag-grid находится, поэтому я использовал событие входного свойства для отправки данных от моего владельца добавления. компонент к сетке. Я отображаю селектор компонента сетки в моем add-onwer.component.ts, передавая данные ввода, как указано. Теперь я использую входное свойство в своей сетке для получения значения, но я хочу, чтобы сетка обновлялась автоматически при изменении данных строки. Значение не обновляется, как мне этого добиться. Я мог видеть, что значения выталкиваются в список владельцев, но каким-то образом я должен показывать в сетке. У меня нет точного кода, но я старался изо всех сил, чтобы объяснить.

ADD-OWNER.Component.html

<button mat-button (click)="openDialog()">Open dialog</button>
      <app-grid-selector [gridOptions]="ownerlist ">

ADD-OWNER.Component.ts

  openDialog() {
    const dialogRef = this.dialog.open(OwnerDetails);

    dialogRef.afterClosed().subscribe(result => {
      ownerlist = Pushing data into a metadata service which is working fine
    });}

grid.component.html

    <ag-grid-angular 
    style="width: 500px; height: 500px;" 
    class="ag-theme-balham"
    [rowData]="owner" 
    [columnDefs]="columnDefs"
    >
</ag-grid-angular>

grid.component.ts

 @Input() gridoptions
   ngOnint(){
   owner =this.gridOptions.rowData
   }
Источник

0 ответов

По состоянию на ag-grid версия `^22.1.1 вы можете использовать

В компоненте:

onRowDataUpdated в качестве

gridOptions = {
    onRowDataUpdated: function(){//do something}
}

Использовать gridOptions в шаблоне как

 <ag-grid-angular
     ...
     [gridOptions]="gridOptions"
     ...
  >
  </ag-grid-angular>
Источник
Другие вопросы по тегам