Как реализовать элемент стиля тега для текстового редактора quill, который можно удалить, нажав «x» - PullRequest
0 голосов
/ 11 июля 2019

Поэтому я пытаюсь реализовать что-то вроде тега для редактора форматированного текста (ngx-quill), который должен иметь знак «x», чтобы иметь возможность удалить его.

Япытался использовать пергамент, удаляя из родительского узла, используя remove для прототипа (но отсутствует родительский узел).

const Embed = Quill.import('blots/embed');

export class Shortcode extends Embed {

    static create(value: any) {
        const node = super.create();
        node.className = 'shortcode-tag';
        node.innerHTML = value.inner;
        node.appendChild(Shortcode.createClose());
        return Shortcode.setDataValues(node, value.data);
    }

    static createClose() {
        const close = document.createElement('button');
        close.type = 'button';
        close.className = 'delete-shortcode';
        close.setAttribute('aria-label', 'Close');
        close.innerHTML = `<span aria-hidden='true'>&times;</span>`;

        close.addEventListener('click', (event) => {
            // click on close button
        });

        return close;
    }

    static setDataValues(element, data) {
        const domNode = element;
        domNode.dataset.shortcode = data;
        return domNode;
    }

    static value(node) {
        return node.dataset.shortcode;
    }
}
...