内联 tinymce 在工具栏单击时显示错误

Question

我的应用程序需要内联编辑内容。 Tinymce 编辑器应在单击按钮时内嵌显示。

一切正常，内联编辑器出现在按钮单击并且内容也被突出显示以进行编辑。 但是当我开始编辑时，说要使文本加粗，编辑器消失了，并显示如下所示的控制台错误；

zone.js:199 未捕获类型错误：无法读取 null 的属性“childNodes”

at Object.read$1 [as read] (tinymce.js:15050)
at Object.createFromEditor (tinymce.js:15095)
at Object.add (tinymce.js:15266)
at Editor.addNonTypingUndoLevel (tinymce.js:15158)
at EventDispatcher.fire (tinymce.js:25978)
at Editor.fire (tinymce.js:26084)
at tinymce.js:11940
at tinymce.js:2206
at ZoneDelegate.push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask (zone.js:423)
at Zone.push../node_modules/zone.js/dist/zone.js.Zone.runTask (zone.js:195)

问题仅在于内联编辑器，另一个工作正常。 但要求是使用内联编辑器。

这是我调用的 function 以显示内联 tinymce：

openEditor(elementid: string) {
    let selector = '#' + elementid;
    let strcontent = $(selector).html();
    var plugins_str = 'paste,save,charmap,link,autoresize';
    var toolbar_icons = "bold | italic | link unlink";
    tinymce.baseURL = '../../../assets';

    tinymce.init({
        selector: selector,
        cache_suffix: "?v=4",
        entity_encoding: "raw",
        valid_elements: "*[*]",
        menubar: false,
        toolbar1: toolbar_icons,
        plugins: [ plugins_str ],
        statusbar: false,
        inline: true,
        resize: true,
        initialValue: {},
        autofocus: true,
        save_onsavecallback: function (e) {
            var savecontent = e.getContent();
        },
        save_oncancelcallback: function (e) {
            e.remove();
            var corresp_elm = document.getElementById(elementid);
            corresp_elm.outerHTML = that.editor_in_data;
            that.reinstateEditableElements();
        }
    });

}