Render SVG Twig - Symfony 4 - PullRequest
Новая
       13

Render SVG Twig - Symfony 4

0 голосов
/ 08 ноября 2019

Это рабочий 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>

Когда я пытаюсь загрузить его динамически веткой, у меня ничего не отображается

Это то, что я делаю 

<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. Но ничего не напечатано. Конечно, если я использую это непосредственно без прута, это работает :(

Спасибо

1 Ответ

1 голос
/ 08 ноября 2019

Используйте фильтр raw , чтобы сообщить Twig не экранировать содержимое вашего элемента: 

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

Возможно, вы также захотите удалить style="display:none;"

...