Quill 中图像标签的数据属性

Question

我想将自定义数据属性添加到图像标签（例如，data-filename="abc.jpeg"），它可以在 Quill 编辑器中存储某些元数据。我在 Quill 中尝试了归因器，但无法成功完成工作。

谁能帮忙

Answer 1

问题已解决。我通过扩展 Quill 图像格式创建了一个新的印迹。

const ImageBlot = Quill.import('formats/image');
export class CustomImageBlot extends ImageBlot {

  static blotName = 'customImage';
  static tagName = 'img';

  /**
   * Converts the HTML tag to image blot
   * @param value 
   */
  static create(value) {

    let node = super.create();

    node.setAttribute('src', value.url);
    node.setAttribute('data-attr', value.data);

    return node;
  }

  /**
   * Converts the image blot to HTML tag
   * @param node 
   */
  static value(node) {

    var blot = {};

    blot.url = node.getAttribute('url');
    blot.data_attr = node.getAttribute('data-attr');

    return blot;
  }
}

非常感谢 Loa 的编辑。我能够解决一些默认支持图像格式的问题。

Quill 中图像标签的数据属性

Data attribute for image tag in Quill

quill

ngx-quill