Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Request for API to Retrieve Specific Node Data Using editor.getData() #288

Open
oobg opened this issue Jul 12, 2024 · 0 comments
Open

Request for API to Retrieve Specific Node Data Using editor.getData() #288

oobg opened this issue Jul 12, 2024 · 0 comments

Comments

@oobg
Copy link

oobg commented Jul 12, 2024

Problem Description

I am currently trying to optimize the performance when inserting and editing large amounts of content in ckeditor-vue. Specifically, we need an API that returns the same data as editor.getData() but allows us to retrieve only specific nodes.

Current Implementation

To achieve this, I have implemented the following solution. However, I would like to know if there is an existing API in CKEditor that can handle this task more efficiently:

getContentAtIndex(index) {
    const modelElement = this.editor.model.document.getRoot().getChild(index);
    if (!modelElement) return "";

    const viewFragment = this.editor.data.toView(modelElement);
    let html = this.editor.data.processor.toData(viewFragment);

    let tagName = modelElement.name;
    if (modelElement.name.startsWith('heading')) {
        tagName = `h${modelElement.name.slice(-1)}`;
    } else if (modelElement.name === 'paragraph') {
        tagName = 'p';
    }

    const attributes = Array.from(modelElement.getAttributeKeys())
        .map(attrKey => `${attrKey}="${modelElement.getAttribute(attrKey)}"`)
        .join(' ');

    return `<${tagName}${attributes ? ` ${attributes}` : ''}>${html}</${tagName}>`;
}

This message is being posted via a translation tool, so there might be slight changes in meaning. Thank you for your understanding.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant