ng2-smart-table-添加行后新行数据为空

时间:2019-07-05 06:13:03

标签: angular ng2-smart-table nebular

对于ng2-smart-table 添加一行后,表中显示的数据为空 但我可以编辑空白行并保存,也可以删除。

event.newData 中显示的

数据为空

(createConfirm)=“ onCreateConfirm($ event)-> 不起作用

(editConfirm)=“ onSaveConfirm($ event)->可以

(deleteConfirm)=“ onDeleteConfirm($ event)->可以

empty row in table

希望有人可以帮助您 预先谢谢你

  1. .html

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

  1. .ts

        data = [];

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

        },
        delete: {
          confirmDelete: true,
          deleteButtonContent: '<i class="nb-trash"></i>',

        },
        columns: {
          jobProcessId: {
            title: 'ID',
            type: 'number',
            width: '100px',
          },
          processName: {
            title: 'Job Process Name',
            type: 'string',

          },
          processDescription: {
            title: 'Job Process Description',
            type: 'string',
            width: 'auto',

          },
        },
      };

      source: LocalDataSource = new LocalDataSource();
      constructor(private jobProcess: JobProcessService) {

        this.jobProcess.list().subscribe((res: any[]) => {
          this.data = res;
          console.log(this.data);
          this.source.load(this.data);
        } );

      }

      ngOnInit() {
      }

      onCreateConfirm(event) {
        console.log(event.newData);
        if (window.confirm('Are you sure you want to create?')) {
          event.confirm.resolve();
        } else {
          event.confirm.reject();
        }
      }
      onDeleteConfirm(event) {
        if (window.confirm('Are you sure you want to delete?')) {
          event.confirm.resolve();
        } else {
          event.confirm.reject();
        }

      }

        onSaveConfirm(event) {
        if (window.confirm('Are you sure you want to save?')) {
            event.confirm.resolve();
          } else {
            event.confirm.reject();
          }
      }

1 个答案:

答案 0 :(得分:0)

将此内容用于您的html

 <ng2-smart-table [settings]="settings" [source]="source" 
(createConfirm)="onCreateConfirm($event)"

(deleteConfirm)="onDeleteConfirm($event)"
(editConfirm)="onSaveConfirm($event)">

 </ng2-smart-table>

*组件*

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);
  }