Angular 如何获取ng2智能表中的所有行
我的应用程序中有一个智能表格组件,用户可以使用默认功能将记录插入表格。然后,用户需要单击“保存”按钮(不是智能表的一部分),以便将记录保存到数据库中。如何将输入表中的所有记录检索到onSave()函数 下面是我的html代码Angular 如何获取ng2智能表中的所有行,angular,Angular,我的应用程序中有一个智能表格组件,用户可以使用默认功能将记录插入表格。然后,用户需要单击“保存”按钮(不是智能表的一部分),以便将记录保存到数据库中。如何将输入表中的所有记录检索到onSave()函数 下面是我的html代码 <ng2-smart-table class="dataTable" [settings]="settings" [source]="source"> </ng2-smart-table> <br/> <div class="row
<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
}
设置={
行动:{
加:是的,
编辑:对,
删除:对,
位置:'右'
},
加:{
addButtonContent:“”,
createButtonContent:“”,
取消按钮内容:“”,
},
编辑:{
EditButton内容:“”,
saveButtonContent:“”,
取消按钮内容:“”,
},
删除:{
deleteButtonContent:“”,
确认删除:正确,
},
栏目:{
财产:{
标题:“财产”,
键入:“字符串”,
宽度:“30%”
},
价值:{
标题:“价值”,
键入:“字符串”,
宽度:“60%”
}
}
};
tableData=[];
source:LocalDataSource=newlocaldatasource();
恩戈尼尼特(){
this.tableData=//从API加载数据
this.source.load(this.tableData);
}
onSave(){
//检索所有表记录
}
使用以下承诺getAll()
从source
this.source.getAll().then(res =>{
console.log(res);
});
更新
//declare
source: LocalDataSource;
tableData = [];
ngOnInit() {
this.tabledata = //gettin info from API
this.source = new LocalDataSource([]);
this.source.load(this.tableData.slice(0));
}
实际上我试过这个。但它总是一无所获。似乎不支持双向绑定。sourceNice这是一个很好的解决方案!!