Ng2-智能表'Add New'按钮事件绑定到外部按钮

Question

我一直在为表格网格使用ng2智能表格插件。有一个Add new按钮可将条目添加到表中。

但我只想从外部按钮触发'Add new'事件(可能在表的顶部，但不在表内(。ng2智能表中已经提供了一个功能，这与我的要求完全相反。这可以通过使用CCD_ 3来实现。

目前，这是一个开放的问题，他们的Github页面。

如果他们没有Ng2智能表的选项，那么是否可以将事件绑定到Angular 6中的其他按钮(外部(？如果是，我该怎么做？

Answer 1

您可以通过DOM对象事件触发ng2智能表的创建事件。

比方说我的ng2智能表的添加按钮设置

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智能表中的"添加"按钮，如

onAdd(event) {
$(".add").click();   
}

Answer 2

您需要使用LocalDataSource或ServerDataSource。

我也有同样的问题，在尝试了一些例子后，我看到了这里的好例子。在这部分代码中，他们使用数据源方法load(data(with 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();

它对我有用。我希望它能有所帮助。

Answer 3

试试看：在您的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(); }