ckeditor - 不同插件中多个样式属性的转换不起作用？

Question

我为 ckeditor 开发了一些插件，它们通过添加带有 style 属性的 span 标签来工作。

• 字母间距
• 线高
• 文本变换

当我在编辑器中进行更改时，它们工作正常，但是当我<p><span style="line-height:3;letter-spacing:18px;text-transform:uppercase;font-family:Ubuntu, Arial, sans-serif;font-size:12px;">safasfasfas</span></p>只用text-transform,初始化编辑器时font-family，它们工作正常，font-size但其余 2 个插件/样式属性不起作用。

有什么想法，我做错了什么？

编辑：我有如下转换

editor.conversion.for( 'downcast' )
            .add( downcastAttributeToElement( {
                model: {
                    key: 'letterSpacing',
                    name: '$text'
                },
                view: ( modelAttributeValue, viewWriter ) => {
                    return viewWriter.createAttributeElement( 'span', { style: 'letter-spacing:' + modelAttributeValue + 'px' } );
                }
            } ) );

        editor.conversion.for( 'upcast' )
            .add( upcastElementToAttribute( {
                view: {
                    name: 'span'
                },
                model: {
                    key: 'letterSpacing',
                    value: viewElement => {
                        const letterSpacing = viewElement.getStyle( 'letter-spacing' );

                        if (letterSpacing === undefined) {
                            return null;
                        }

                        return letterSpacing.substr( 0, letterSpacing.length - 2 );
                    }
                }
            } ) );

Answer 1

我可以通过在转换中添加以下代码来解决此问题。

styles: {
   'letter-spacing': /[\S]+/
}

现在转换变得像

editor.conversion.for( 'downcast' )
            .add( downcastAttributeToElement( {
                model: {
                    key: 'letterSpacing',
                    name: '$text'
                },
                view: ( modelAttributeValue, viewWriter ) => {
                    return viewWriter.createAttributeElement( 'span', { style: 'letter-spacing:' + modelAttributeValue + 'px' } );
                }
            } ) );

        editor.conversion.for( 'upcast' )
            .add( upcastElementToAttribute( {
                view: {
                    name: 'span',
                    styles: {
                        'letter-spacing': /[\S]+/
                    }
                },
                model: {
                    key: 'letterSpacing',
                    value: viewElement => {
                        const letterSpacing = viewElement.getStyle( 'letter-spacing' );

                        if (letterSpacing === undefined) {
                            return null;
                        }

                        return letterSpacing.substr( 0, letterSpacing.length - 2 );
                    }
                }
            } ) );