如何获取ng2-smart表的所有行

时间:2018-06-20 17:43:27

标签: angular

我的应用程序中有一个智能表组件,用户可以在其中使用默认功能将记录插入到表中。然后,用户需要单击“保存”按钮(不是智能表的一部分)以将记录保存到数据库中。如何检索所有输入到onSave()函数表中的记录?

以下是我的html代码

<ng2-smart-table class="dataTable" [settings]="settings" [source]="source">
</ng2-smart-table>
<br/>
<div class="row" style="float: right; padding-right: 15px;">
    <div class="container-btn" > 
    <button class="btn btn-blue-bordered btn-sm" style="margin-right: 5px;">Cancel</button>
    <button class="btn btn-blue btn-sm" (click)="onSave()">Save</button>
    </div>
</div>

JS代码

settings = {
  actions: {
  add: true,
  edit: true,
  delete: true,
  position: 'right'
},
add: {
  addButtonContent: '<i class="nb-plus"></i>',
  createButtonContent: '<i class="nb-checkmark"></i>',
  cancelButtonContent: '<i class="nb-close"></i>',
},
edit: {
  editButtonContent: '<i class="nb-edit"></i>',
  saveButtonContent: '<i class="nb-checkmark"></i>',
  cancelButtonContent: '<i class="nb-close"></i>',
},
delete: {
  deleteButtonContent: '<i class="nb-trash"></i>',
  confirmDelete: true,
},
columns: {
  property: {
  title: 'Property',
  type: 'String',
  width: '30%'
},
value: {
  title: 'Value',
  type: 'String',
  width: '60%'
 }
 }
};

tableData = [];
source: LocalDataSource = new LocalDataSource();

ngOnInit() {
   this.tableData = //load data from API
   this.source.load(this.tableData);
}

onSave() {
   //retrive all table records
}

1 个答案:

答案 0 :(得分:0)

使用以下承诺getAll()来获取source的所有行

 this.source.getAll().then(res =>{
  console.log(res); 
});

doc

更新

//declare
source: LocalDataSource;
tableData = [];

ngOnInit() {
    this.tabledata = //gettin info from API
    this.source = new LocalDataSource([]);    
    this.source.load(this.tableData.slice(0));     
  }