0

Hello I'm tryng to populate ng2-smart-table with array of numbers but currently I'm getting table with 6 empty rows like this: enter image description here

Code for table:

 <ng2-smart-table [settings]="settings" [source]="flowTabs">
    </ng2-smart-table>
  public settings: any = {
    pager: {
      display: true,
      perPage: 20,
    },
    actions: {
      add: false,
      edit: false,
      delete: false,
    },
    columns: {
      naziv: {
        title: 'Naziv',
        type: 'string',
      }
    },
    noDataMessage: 'Nema dostupnih podataka'
  }

Fetching array:

 public getRootIds(): void {
    this.loadingData = true;
    this.documentFlowService.getRootIds()
    .pipe(takeUntil(this.destroy$))
    .subscribe((data: number[]) => {
      this.flowTabs = data;
      this.loadingData = false;
    },
      err => {
        console.error(err);
        this.loadingData = false;
      })
  }

Appreciate if someone can advise. Thank you in advance!

Ranko Koturic
  • 127
  • 1
  • 1
  • 8

1 Answers1

1

Based on the documentation, try to update your subscription data assignment with:

this.flowTabs = new LocalDataSource(data);

The second thing I suggest also is to update your html template and display the ng2-smart-table element only when data has been loaded:

 <ng2-smart-table *ngIf="flowTabs && !loadingData" [settings]="settings" [source]="flowTabs">
    </ng2-smart-table>
JStw
  • 1,155
  • 11
  • 20
  • 1
    I suspect your `` component is displayed with a source which is empty during your component init, but when data are ready component data are not reloaded, see this topic: https://stackoverflow.com/questions/55117360/refresh-ng2-smart-table – JStw Oct 05 '22 at 12:45