angular slickgrid，触发选择编辑器更改事件时的单元格编辑

Question

我使用的是角度为7的角度丝网格。我正在使用内联编辑功能。我使用单选编辑器进行内联编辑。目前我想实现这个功能：

用户单击可编辑字段后，将显示选择下拉列表。在从选择下拉列表中选择任何选项时，内联模式应该存在，列值应该更新。

目前我需要点击其他字段以退出联机模式(我想在选择选项时实现这一点(

editor: {
// display checkmark icon when True
enableRenderHtml: true,
// tslint:disable-next-line:max-line-length
collection: [{
value: 1,
label: 'Sucessful'
}, {
value: 2,
label: 'Unsucessful'
}],
model: Editors.singleSelect, // CustomSelectEditor
elementOptions: {
autoAdjustDropPosition: false,
onClick: (event, rr) => {
// here i want to write some code which can trigger to grid to start update
}
}
}

Answer 1

谢谢大家的回答。我已经解决了我的问题如下：

editor: {
enableRenderHtml: true,
collection: [{ value: CCLStaus.Sucessfull, label: 'Sucessful' }, { value: CCLStaus.UnSucessfull, label: 'Unsucessful' }],
model: Editors.singleSelect,// CustomSelectEditor
elementOptions: {
onClick: (event) => {
const updateItem = this.angularSilkGrid.gridService.getDataItemByRowIndex(this.rowInEditMode);
updateItem.status = +event.value;
this.angularSilkGrid.gridService.updateItem(updateItem, { highlightRow: false });
this.angularSilkGrid.gridService.renderGrid();
}
}
}

Answer 2

一般来说，

grid.getEditorLock().commitCurrentEdit()

将提交并关闭编辑器。此外，任何

grid.navigateRight()
grid.navigateLeft()
grid.navigateDown()
grid.navigateUp()
grid.navigateNext()
grid.navigatePrev()

将优雅地提交并退出。在select2编辑器中，您会注意到：

this.init = function () {
...
// Set focus back to select2 element on closing.
$input.on('select2:close', function (e) {
if ((e.params.originalSelect2Event && e.params.originalSelect2Event.data) 
|| e.params.key === 9) {
// item was selected with ENTER or no selection with TAB
args.grid.navigateNext();
} else {
// closed with no selection
setTimeout(function () {
$input.select2('focus');
}, 100);
}
});
};
this.destroy = function () {
$input.select2('destroy');
$input.remove();
};

，注意args.grid.navigateNext()将提交并关闭编辑器，包括在适当的时候调用destroy()方法。

Answer 3

在Angular Slickgrid Editor示例中，示例中有一个auto commit复选框，这是您需要在网格选项中启用的设置

this.gridOptions = {
autoEdit: true,
autoCommitEdit: true,
}

lib将像Ben在回答中所写的那样在内部调用grid.getEditorLock().commitCurrentEdit()，在Angular Slickgrid中，您只需设置我添加的autoCommitEdit标志即可。