AG_Grid, Angular-Apollo, данные из запроса Apollo не могут сгенерировать данные строки для сетки

Question

Я пытаюсь использовать службу Angular для выполнения запроса с Apollo и использую эти данные для генерации строк в моей ag-сетке.Однако сетка не производит строки, хотя я получаю Observable.Я новичок во всех этих технологиях и, честно говоря, я волнуюсь, что написал кучу бреда.

files.service.ts

import fileListQuery from '../queries/fileListQuery';
import { File } from 'sherlock';

@Injectable({
  providedIn: 'root'
})
export class FilesService {

constructor(private apollo: Apollo) { }

getAllFiles() {
  return this.apollo.watchQuery<File>({
    query: fileListQuery
  })
    .valueChanges
    .pipe(
      map(results => results.data)
    )
  }
}

table.component.ts

import { Component, Input, OnInit } from '@angular/core';
import {GridOptions} from "ag-grid-community";

import { FilesService } from '../files.service';

@Component({...})
export class TableComponent implements OnInit {
  private gridOptions: GridOptions;

  filter= 'All';

  @Input() initialRowData;

  constructor(private filesService: FilesService) {

    // calling service function here
    this.initialRowData = this.filesService.getAllFiles();

    this.gridOptions = <GridOptions>{...};

    this.gridOptions.columnDefs = [
      {headerName: 'Status', field: 'status.name', sortable: true, filter: true, headerCheckboxSelection: true, checkboxSelection: true},
      {headerName: 'FileName', field: 'filename', sortable: true, filter: true},
      {headerName: 'Delivered', field: 'deliveryDate', sortable: true, filter: true},
    ];

    this.gridOptions.rowData = this.initialRowData; // data should go here
    }
  }

types.ts

export type File = {
    id: string,
    filename: string,
    extension?: string,
    path?: string,
    deliveryDate?: string,
    status: Status
}

Изначально я вызвал сервисную функцию OnInit, но это тоже не сработало.

Answer 1

Решено! Мне пришлось добавить subcribe и некоторые события Grid Api, например, так:

export class TableComponent implements OnInit {
  private gridOptions: GridOptions;
  private initialRowData$;

  filter= 'All';

  constructor(private filesService: FilesService) {

    this.initialRowData$ = this.filesService.getAllFiles();

    this.gridOptions = <GridOptions>{
      floatingFilter: true,
      rowSelection: 'multiple',
      rowClassRules: {...},
      isExternalFilterPresent:  this.isExternalFilterPresent.bind(this),
      doesExternalFilterPass: this.doesExternalFilterPass.bind(this),

      onGridReady: () => {
        this.initialRowData$.subscribe(
          rowData => this.gridOptions.api.setRowData(rowData.files)
        );
      }
    };