Edit and create using ng2-smart-table

Question

I am trying to use ng2-smart-table, I do not know how to associate the plus button (addButtonContent) with some data about the creation of the function. Now it just opens for me to add data. also how to do it for the edit button. My code is:

settings = { add: { addButtonContent: '<i class="ion-ios-plus-outline"></i>', //how to call some function to this one createButtonContent: '<i class="ion-checkmark"></i>', cancelButtonContent: '<i class="ion-close"></i>', }, edit: { editButtonContent: '<i class="ion-edit"></i>', saveButtonContent: '<i class="ion-checkmark"></i>', cancelButtonContent: '<i class="ion-close"></i>', }, delete: { deleteButtonContent: '<i class="ion-trash-a"></i>', confirmDelete: true }, 

and my template:

  <ba-card title="Basic Example" baCardClass="with-scroll"> <div class="form-group"> <input #search type="search" class="form-control form-control-lg" placeholder="Search..." (keyup)="onSearch(search.value)"> </div> <ng2-smart-table [settings]="settings" [source]="source" (deleteConfirm)="onDeleteConfirm($event)"></ng2-smart-table> </ba-card> 

Answer 1

in your template add this

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

and then in your component call new actions

 onCreateConfirm(event):void { } onSaveConfirm(event):void { } onDeleteConfirm(event): void { } 

Answer 2

I wanted to comment on the answer of Yousef Al Qahqi, but I am a beginner, so I have to answer again:

You must also add confirmCreate: true , otherwise the method will not be called.

 add: { addButtonContent: '<i class="nb-plus"></i>', createButtonContent: '<i class="nb-checkmark"></i>', cancelButtonContent: '<i class="nb-close"></i>', confirmCreate: true, },