渲染 svg 树枝 - Symfony 4

Question

这是一个工作 svg。

<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 48 48">
<g id="home">
  <path fill="#90A4AE" d="M42,48H6c-3.3,0-6-2.7-6-6V6c0-3.3,2.7-6,6-6h36c3.3,0,6,2.7,6,6v36C48,45.3,45.3,48,42,48z"/>
  <path fill="#212121" d="M20.8,35.5v-9.6h6.4v9.6h8V22.7H40L24,8.3L8,22.7h4.8v12.8H20.8z"/>
</g>
</svg>

当我尝试用 twig 动态加载它时，我没有渲染任何东西

这就是我正在做的

<svg style="display:none;">
    <defs>
        {% for item in items %}
            <g id="{{item.label}}">
                {{item.svg}}
            </g>
        {% endfor %}
</svg>

稍后

    {% for item in items %}
        <li class="nav__items ">
            <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 48 48">
                <use xlink:href=#{{item.label}}></use>
            </svg>
            <a href="{{item.target}}">{{item.label}}</a>
        </li>
    {% endfor %}

当我检查结果 html 时，使用正常。我可以在里面找到家庭内容 svg。但是没有打印任何内容。当然，如果我不使用 twig 直接使用它就可以了:(

谢谢

Answer 1

使用 raw 过滤器告诉 Twig 不要转义您项目的内容：

<svg style="display:none;">
    <defs>
        {% for item in items %}
            <g id="{{item.label}}">
                {{item.svg|raw}}
            </g>
        {% endfor %}
</svg>

您可能还想删除 style="display:none;"

渲染 svg 树枝 - Symfony 4

Render svg twig - Symfony 4

svg

symfony

twig