如何编辑svg并将其作为数据发送

Question

我在html中有内联SVG，我用javascript编辑了路径颜色。我希望能够保存该SVG并将其作为数据发送到服务器，然后再显示给其他设备。什么是最好的方法。是否有任何这样做的库。我正在使用角度。

Answer 1

在 component.html

中

<svg xmlns="http://www.w3.org/2000/svg" #container>
    <!-- your svg here -->
</svg>

在 component.ts

中

@ViewChild('container')
container: ElementRef;

saveSvg() {
  const svg = this.container.nativeElement.outerHTML;
  // your code to save svg
}

Answer 2

如果您对根el元素有一个引用，例如<svg />（例如，来自document.getElementById()的引用），则可以通过el.outerHTML检索SVG的当前内容。

此值是一个字符串，您可以按照任意方式将其发送到后端。