ng2-smart-table create button not working correctly

Question

I am getting data from firebase and displaying it with ng2-smart-table.

However, the add dialog doesn't close after I add the data. It's still opened with the values that were added.

Here's my code:

settings = {
    pager:{perPage:50},
    add: {
        addButtonContent: '<i class="ion-ios-plus-outline"></i>',
        createButtonContent: '<i class="ion-checkmark"></i>',
        cancelButtonContent: '<i class="ion-close"></i>',
        confirmCreate: true,
    },

The function to create:

onCreateConfirm(event): any {
    //this service is updating the new data to firebase.
    this.service.createData(event.newData);
    //after that the newdata still on edit mode and not closing it...
}

Answer 1

Add this in your template html

     <ng2-smart-table [settings]="settings" [source]="source" 
(createConfirm)="onCreateConfirm($event)"
(deleteConfirm)="onDeleteConfirm($event)"
(editConfirm)="onSaveConfirm($event)">
     </ng2-smart-table>

Component

    settings = {delete: {
      confirmDelete: true
    },
    add: {
      confirmCreate: true
    },
    edit: {
      confirmSave: true
    },
     .......
    }


  source: LocalDataSource;

  constructor() {
    this.source = new LocalDataSource(this.data);
  }

  onDeleteConfirm(event):void {
    if (window.confirm('Are you sure you want to delete?')) {
      event.confirm.resolve(); 
    } else {
      event.confirm.reject();
    }
  }

  onSaveConfirm(event):void {
    if (window.confirm('Are you sure you want to save?')) {
      event.newData['name'] += ' + added in code'; 
      event.confirm.resolve(event.newData);
    } else {
      event.confirm.reject();
    }
  }

  onCreateConfirm(event):void { 
      event.confirm.resolve(event.newData);
  }