Question

我目前无法通过我的指令的模板HTML生成此svg图像。我使用的是AngularJS，但它是用CoffeeScript编写的。

  .directive 'FileOutput', () ->

    result =
      restrict: "A"
      replace: true
      transclude: true
      scope: {item: "="}
      template: '<div>' +
                  '<div ng-if = "item.type == \'seg\'">{{item.data}}' +
                  '</div>'

SVG对象的开头如下所示：

<?xml version="1.0" encoding="utf-8" standalone="no"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg width="3000px" height="3000px" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<g id="bg">
<rect x="0" y="0" width="3000px" height="3000px" style="fill:rgb(255,255,255);"/>

到目前为止，代码会检查传入的项对象，并检查 item.type 是否等于＆＃39; seg＆＃39;。这部分工作正常。传入对象的第二部分是 item.data ，其中包含所有SVG代码。到目前为止我取得的最大成功是在网页上显示原始代码。

我不确定如何实际呈现此原始代码中包含的图像。

非常感谢任何帮助！

Answer 1

你试过这个吗？

  template: '<div>' +
              '<div ng-if = "item.type == \'seg\'">' + item.data +
              '</div>'

如何在AngularJS中呈现对象中包含的SVG代码

1 个答案: