CKEditor小部件在呈现数据后接收数据

CKEditor小部件在呈现数据后接收数据,ckeditor,ckeditor4.x,Ckeditor,Ckeditor4.x,查看您可以将启动数据传递给小部件的: editor.execCommand( 'simplebox', { startupData: { align: 'left' } } ); 然而,这些数据是毫无意义的,因为似乎没有办法影响模板输出-它已经在小部件初始化之前生成,而且数据在该点上甚至不可用: editor.widgets.add('uselesswidget', { init: function() { // `this.data`

查看您可以将启动数据传递给小部件的:

editor.execCommand( 'simplebox', {
    startupData: {
        align: 'left'
    }
} );
然而,这些数据是毫无意义的,因为似乎没有办法影响模板输出-它已经在小部件初始化之前生成,而且数据在该点上甚至不可用:

editor.widgets.add('uselesswidget', {

    init: function() {
        // `this.data` is empty..
        // `this.dataReady` is false..

        // Modifying `this.template` here does nothing..
        // this.template = new CKEDITOR.template('<div>new content</div>');

        // Just after init setData is called..
        this.on('data', function(e) {
            // `e.data` has the data but it's too late to affect the tpl..
        });
    },

    template: '<div>there seems to be no good way of creating the widget based on the data..</div>'

});
editor.widgets.add('uselesswidget'{
init:function(){
//'this.data'为空。。
//'this.dataReady'是假的。。
//在此处修改`this.template`不会起任何作用。。
//this.template=新的CKEDITOR.template(“新内容”);
//就在调用init setData之后。。
此.on('data',函数(e){
//`e.data`有数据,但现在影响第三方物流已经太迟了。。
});
},
template:“似乎没有基于数据创建小部件的好方法…”
});
另外,添加CKEditor标记会引发“未捕获的TypeError:无法读取未定义的属性'align'异常”,因此数据似乎也不会传递到原始模板:

template: '<div>Align: {align}</div>'
模板:“Align:{Align}”
如果无法动态传递数据,那么拥有一个可以接受上下文的
CKEDITOR.template.output
函数有什么意义

到目前为止,我发现的唯一骇人的解决方案是在commandexec之前拦截
中的命令并阻止它,然后修改
模板
并再次手动执行该命令

有没有根据传递的数据生成动态模板的想法?谢谢。

我是这样做的

小部件定义:

template:
   '<div class="myEditable"></div>',

init: function () {
        // Wait until widget fires data event
        this.on('data', function(e) {

            if (this.data.content) {
                // Clear previous values and set initial content
                this.element.setHtml('')
                var newElement = CKEDITOR.dom.element.createFromHtml( this.data.content );
                this.element.append(newElement,true);
                this.element.setAttribute('id', this.data.id);
            }

            // Create nestedEditable
            this.initEditable('myEditable', {
                selector: '.myEditable',
                allowedContent: this.data.allowedContent
            })

        });
    }
模板:
'',
init:函数(){
//等待小部件触发数据事件
此.on('data',函数(e){
if(this.data.content){
//清除以前的值并设置初始内容
this.element.setHtml(“”)
var newElement=CKEDITOR.dom.element.createFromHtml(this.data.content);
this.element.append(newElement,true);
this.element.setAttribute('id',this.data.id);
}
//创建嵌套可编辑
this.initEditable('myEditable'{
选择器:'.myEditable',
allowedContent:this.data.allowedContent
})
});
}
动态小部件创建:

        editor.execCommand('myEditable', {startupData: {
            id: "1",
            content: "some <em>text</em>",
            allowedContent: {
              'em ul li': true,
            }
        }});
editor.execCommand('myEditable',{startupData:{
id:“1”,
内容:“一些文字”,
允许的内容:{
“em ul li”:没错,
}
}});

有点晚了,但我通过修改代码使其正常工作,直到正确修复为止,请参阅我制作的错误报告: