我一直在为表格网格使用ng2-smart-table插件。有一个Add new
按钮可将条目添加到表中。
但是我只想从外部按钮触发'Add new'
事件(可能在表格的顶部,但不在表格内)。 There is a feature already available in the ng2-smart-table与我的要求完全相反。这可以通过使用'mode:external'
当前此问题以他们的Github page为开题。
如果他们没有Ng2-smart-table的选项。无论如何,将事件绑定到Angular 6中的其他按钮(外部)吗?如果是这样,请告诉我如何在Angular 6中进行操作。
任何帮助将不胜感激。
答案 0 :(得分:1)
您可以通过DOM对象事件触发ng2-smart-table的create事件。
假设我的ng2-smart-table的添加按钮设置
add: {
addButtonContent : '<span class="add"><i class=""></i></span>',
createButtonContent:'<i class="far fa-save"></i>',
cancelButtonContent: '<i class="fas fa-times"></i>',
confirmCreate: true,
}
然后点击您的外部按钮会触发ng2-smart-table中的“添加”按钮的点击,例如
onAdd(event) {
$(".add").click();
}
答案 1 :(得分:0)
您需要使用LocalDataSource或ServerDataSource。
我有相同的问题,在尝试了一些示例之后,我看到了一个不错的here。 在这部分代码中,他们将data source method load(data)与source(LocalDataSource)结合使用:
constructor(protected service: BasicExampleLoadService) {
this.source = new LocalDataSource();
this.service.getData().then((data) => {
this.source.load(data);
});
}
然后我尝试使用我的代码并对LocalDataSource进行相同的操作,但是我在表中添加了一行:
this.source.add({
name: 'name',
description: 'desc',
numQuestions: '8',
});
this.source.refresh();
它对我有用。 希望对您有所帮助。
答案 2 :(得分:-1)
尝试: 在您的html上:
<button (click)="addRecord()">Add</button>
<ng2-smart-table #smartTable [settings]="settings" [source]="source"></ng2-smart-table>
在您的组件上:
@ViewChild('smartTable') smartTable;
.
.
.
addRecord() {
this.smartTable.grid.createFormShown = true;
this.smartTable.grid.getNewRow();
}