Question

我正在尝试编辑高亮的实际现有插件，以便能够添加可从命令参数自定义的文本颜色，这意味着，如果您将RGB或十六进制颜色放置在选择内容上，则会创建视图属性style = '颜色：PARAMETER'

到目前为止，我所得到的只是用字体标签围住文本，用颜色围住style属性，但是颜色值不正确。

这意味着命令上的值没有传递给转换器。

我无法找到从命令传输输入信息以直接在转换器中使用以使此功能起作用的方法。

此插件的正常行为使其无法使用RGB的1600万种颜色，并且需要已定义颜色的过时模型。

您可以在此存储库中查看/编辑/使用我到目前为止所做的事情

https://github.com/klys/ckeditor5-highlight-inline

在这一部分中，转换器创建具有样式颜色但颜色值不正确的字体元素。

editor.conversion.attributeToElement( {
        model: HIGHLIGHT,
            view: {
                name: 'font',
                styles: {
                    'color': true
                },
                priority: 5,
                model: {
                    key: 'highlight',
                    value: viewElement => viewElement.getAttribute( 'color' )
                },
                type:'pen'
            }
    } );

这是原始插件中经过编辑的命令执行器，我对其进行了编辑以满足该功能的需求。

    execute( color ) {

    const model = this.editor.model;
    const document = model.document;
    const selection = document.selection;

    //const highlighter = options.value;
    /*var __model;
    for ( const option of options ) {
     __model = new Model( {
            model: 'color model',
            class: 'color-class',
            title: 'color pen',
            color: option.value,
            type: 'pen'
        } );
    }
    const highlighter = __model;*/

    model.change( writer => {
        const ranges = model.schema.getValidRanges( selection.getRanges(), 'highlight' );

        if ( selection.isCollapsed ) {
            const position = selection.getFirstPosition();

            // When selection is inside text with `highlight` attribute.
            if ( selection.hasAttribute( 'highlight' ) ) {
                // Find the full highlighted range.
                const isSameHighlight = value => {
                    return value.item.hasAttribute( 'highlight' ) && value.item.getAttribute( 'highlight' ) === this.value;
                };

                const highlightStart = position.getLastMatchingPosition( isSameHighlight, { direction: 'backward' } );
                const highlightEnd = position.getLastMatchingPosition( isSameHighlight );
                const highlightRange = writer.createRange( highlightStart, highlightEnd );

                // Then depending on current value...
                if ( !color || this.value === color ) {
                    // ...remove attribute when passing highlighter different then current or executing "eraser".
                    writer.removeAttribute( 'highlight', highlightRange );
                    writer.removeSelectionAttribute( 'highlight' );
                } else {
                    // ...update `highlight` value.
                    writer.setAttribute( 'highlight', color, highlightRange );
                    writer.setSelectionAttribute( 'highlight', color );
                }
            } else if ( color ) {
                writer.setSelectionAttribute( 'highlight', color );
            }
        } else {
            for ( const range of ranges ) {
                if ( color ) {
                    writer.setAttribute( 'highlight', color, range );
                } else {
                    writer.removeAttribute( 'highlight', range );
                }
            }
        }
    } );
}

我在这个问题上已经快一周了。

如果您至少可以向我指出正确的方向，您将无法想象您会为我提供多少帮助。

无法将参数从命令传递到转换器

0 个答案: