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

时间:2019-10-04 01:20:28

标签: angular tinymce

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

一切正常,单击按钮时将显示内联编辑器,并且内容也将突出显示以进行编辑。但是,当我开始编辑时,说要使文本变为粗体,编辑器就消失了,并显示出如下所示的控制台错误;

  

zone.js:199   未捕获的TypeError:无法读取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)

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

这是我用来显示内联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();
        }
    });

}

0 个答案:

没有答案