Возвращение HTML-элементов из представления в Django

Question

Я пытаюсь вернуть изображение из представления в шаблон в Django. В настоящее время мой взгляд имеет массив, я хочу, чтобы отобразить в таблице, но по-разному (большинство элементов как строки, кроме одного, в частности, как изображение)

items = [ 
    ['an apple', '<img src="apple.png" \\>'], 
    ['a pear', '<img src="pear.png" \\>'], 
    ['an orange', <img src="orange.png" \\>] 
] 

и в моем шаблоне,

<table> 
{% for fruit in items %} 
    <tr> 
    {% for element in fruit %} 
    <td> 
     {{ element }} 
    </td> 
    {% endfor %} 
    </tr> 
{% endfor %} 
</table> 

Это выводит буквальную строку вместо отображения изображения pear.png.

Есть ли способ, которым я могу указать шаблону, чтобы вставить элемент в код, а не отображать его в виде строки?

Answer 1

The filter safe отмечает строку, которая не требует дальнейшего вывода HTML до вывода.

<table> 
{% for fruit in items %} 
    <tr> 
    {% for element in fruit %} 
    <td> 
     {{ element | safe }} 
    </td> 
    {% endfor %} 
    </tr> 
{% endfor %} 
</table> 

---

Sidenote: Вы также можете преобразовать структуру элементов в Словаре для более легкого и более четкого использования:

items = { 
    'an apple': '<img src="apple.png" />', 
    'a pear': '<img src="pear.png" />', 
    'an orange': '<img src="orange.png" />' 
} 

Шаблон:

<table> 
{% for fruit, img in items.items %} 
    <tr> 
    <td> {{ fruit }} 
    <td> {{ img | safe }} </td> 
    </tr> 
{% endfor %} 
</table> 

---

Наконец Вы можете также добавить только источник изображения в вашем Dict и избежать необходимости использовать safe:

items = { 
    'an apple': 'apple.png', 
    'a pear': 'pear.png', 
    'an orange': 'orange.png' 
} 

Шаблон:

<table> 
{% for fruit, img in items.items %} 
    <tr> 
    <td> {{ fruit }} 
    <td> <img src="{{ img }}" /> </td> 
    </tr> 
{% endfor %} 
</table> 

Answer 2

Вы можете использовать

{% for fruit, fruitimage in items %} 
<td> {{fruit}} </td> 
<td> <img src="{{fruitimage}}"> </td> 
{% endfor %} 

Answer 3

{% for fruit, image_tag in items %} 
    <td> {{fruit}} </td> 
    <td> {{image_tag|safe}} </td> 
    {% endfor %} 

вам нужно пометить строку как безопасные для защиты от XSS https://docs.djangoproject.com/en/1.8/ref/templates/language/#automatic-html-escaping

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

Почему вы хотите отключить его? Поскольку иногда переменные шаблона содержат данные, которые вы намерены отображать как необработанные HTML, в , в каком случае вы не хотите, чтобы их содержимое было экранировано. Например, вы можете сохранить blob HTML в своей базе данных и захотите вставить этот прямо в свой шаблон. Или, возможно, вы используете шаблон Django для создания текста, который не является HTML - как сообщение электронной почты, для экземпляра . Для индивидуального variables¶

Чтобы отключить автоматическую ускользающий для индивидуальных переменного, используйте безопасный фильтр:

Это будет сбежавший: {{данные}} Это не экранировать: {{ данные | сейф }}