Handsontable，自定义文本编辑器，复制/粘贴问题答案

【问题标题】：Handsontable, custom text editor, copy/paste issueHandsontable，自定义文本编辑器，复制/粘贴问题
【发布时间】：2017-09-28 20:35:05
【问题描述】：

我有一个包含两列的表：名称和代码。我为代码列创建了一个简单的自定义编辑器。这个想法是，当用户双击单元格时，会打开带有代码编辑器的自定义对话框。我已经实现了它并在此处发布了简化示例：

Link to plunker

但是，我在使用复制/粘贴功能时遇到了一个问题：如果我使用编辑器，为单元格编辑一些代码，然后按“保存”，“代码”列的值似乎已正确保存。但是当我选择这个单元格并按 Ctrl+C 时，该值不会被复制。

问题是： 是handsontable 中的错误还是我在实现自定义编辑器时遗漏了什么？我应该如何更改我的自定义编辑器以使复制粘贴功能正常工作。

编辑器代码：

var ScriptEditor = Handsontable.editors.TextEditor.prototype.extend();

ScriptEditor.prototype.getValue = function () {
    return this.TEXTAREA.value;
};

ScriptEditor.prototype.setValue = function (value) {
    this.TEXTAREA.value = value;
};

ScriptEditor.prototype.open = function () {

    var self = this;

    this.instance.deselectCell();

    var value = self.instance.getDataAtCell(self.row, self.col);
    var decodedCode = decodeURI(value);

    var success = function (resultCode) {
        var encodedCode = encodeURI(resultCode);

        self.instance.setDataAtCell(self.row, self.col, encodedCode, 'edit');
        self.instance.selectCell(self.row, self.col);
    };

    openEditor(decodedCode)
            .then(success);

};

ScriptEditor.prototype.focus = function () {
    Handsontable.editors.TextEditor.prototype.focus.apply(this, arguments);
};

ScriptEditor.prototype.close = function () {

};


var openEditor = function (codeToEdit) {

    var deferred = $q.defer();

    var dialog = ngDialog.open({
        template: 'editorTemplate.htm',
        className: 'ngdialog-theme-default',
        controllerAs: "editor",
        controller: function () {
            var vm = this;
            vm.inputCode = codeToEdit;
            vm.submitChanges = function () {
                dialog.close();
                deferred.resolve(vm.inputCode);
            };
        }
    });

    return deferred.promise;
};

规格：角度版本：1.6.1 掌上电脑版本：0.31.2 Chrome 版本：版本 58.0.3029.81

【问题讨论】：

标签： javascript angularjs handsontable

【解决方案1】：

我在可动手做的 github 存储库上发布了一个问题，并在那里收到了答案。问题链接：here

解决方案： 就像handsontable 团队的成员所建议的那样，在打开我的对话框之前的打开功能中，我调用this.instance.deselectCell();。但是，使用此解决方案，问题是，如果我按 Enter 我的代码编辑器对话框，则不会插入新行，而是选择了 handsontable 中的下一个单元格。然后，我将电话包裹在setTimeout() 中，并且成功了。

plunker 的链接： here

工作代码是：

ScriptEditor.prototype.open = function () {

    var self = this;

    setTimeout(function () {
        self.instance.deselectCell();
    });

    var value = self.instance.getDataAtCell(self.row, self.col);
    var decodedCode = decodeURI(value);

    var success = function (resultCode) {
        var encodedCode = encodeURI(resultCode);
        self.instance.setDataAtCell(self.row, self.col, encodedCode, 'edit');
        self.instance.selectCell(self.row, self.col);
    };

    openEditor(decodedCode)
        .then(success);

};

【讨论】：