Django как сделать гиперссылку на изображения в статической папке по символу тикера?
У меня есть таблица с тикерами ETF, названиями ETF и названиями их индексов. Я хочу, чтобы каждая запись в таблице была кликабельна и связана с соответствующими изображениями в папке static/images. Каждое изображение названо в честь тикера индекса каждого ETF. Таким образом, когда пользователь нажимает, например, на первую запись ETF тикера "PSCD", ссылка на 'static/myapp/images/sample_regression_S6COND.jpg'
. Подстрока в ссылке "S6COND" - это та часть, которая мне нужна как относительная ссылка. Каждый тикер ETF имеет свой индексный тикер. Эти индексные тикеры находятся в модели, связанной с таблицей
На моей странице table.html, когда я жестко кодирую ссылку на статическое изображение <td><a href="{% static '/myapp/images/sample_regression_S6COND.jpg' %}" target="_blank">{{i.etf_ticker}}</a></td>
(видите, как я ввел "S6COND" в ссылку?), она работает, но не работает, когда я пытаюсь превратить ее в относительную ссылку {{i.index_ticker}}, как <td><a href="{% static '/myapp/images/sample_regression_{{i.index_ticker}}.jpg' %}" target="_blank">{{i.etf_name}}</a></td>
. Мои статические файлы правильно размещены в папке app и включают папки images, css и js. Все изображения находятся в папке static/myapp/images.
table.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>ETF Table</title>
{% load static %}
<link rel="stylesheet" type="text/css" href="{% static 'myapp/css/table_style.css' %}">
<style type="text/css"></style>
</head>
<body>
<div class="container">
<table id="table" class="table table-dark table-hover table-striped table-bordered table-sm">
<thead>
<tr>
<th data-sortable="true">ETF Ticker</th>
<th>ETF Name</th>
<th>Index Name</th>
</tr>
</thead>
<tbody>
{% if d %}
{% for i in d %}
<tr>
<td><a href="{% static '/myapp/images/sample_regression_S6COND.jpg' %}" target="_blank">{{i.etf_ticker}}</a></td>
<td><a href="{% static '/myapp/images/sample_regression_{{i.index_ticker}}.jpg' %}" target="_blank">{{i.etf_name}}</a></td>
<td><a href="{% static '/myapp/images/sample_regression_{{i.index_ticker}}.jpg' %}" target="_blank">{{i.index_name}}</a></td>
<td><a href="{% static '/myapp/images/sample_regression_{{i.index_ticker}}.jpg' %}" target="_blank">{{i.cape}}</a></td>
</tr>
{% endfor %}
{% endif %}
</tbody>
</table>
<script>
$('#table').DataTable({
"bLengthChange": true,
"lengthMenu": [ [20, 50, 100 -1], [20, 50, 100, "All"] ],
"iDisplayLength": 20,
bInfo: false,
responsive: true,
order: [[4, 'desc']],
});
</script>
</div>
</body>
</html>
views.py
def table(request):
data = Table.objects.all().values()
context = {'d': data}
return render(request, 'table.html', context)
models.py
class Table(models.Model):
etf_ticker = models.CharField(max_length=10)
etf_name = models.CharField(max_length=200)
index_name = models.CharField(max_length=200)
index_ticker = models.CharField(max_length=10)
Создайте свой url следующим образом:
<a href="{% static '/myapp/images/sample_regression_'|add:i.index_ticker|add:'.jpg' %}" target="_blank">{{i.etf_name}}</a>
Я разбил ваш url на 3 части. Первая и последняя части - это простые строки. Средняя часть содержит ваш тикер. |
используется для обозначения того, что мы используем один из фильтров языка шаблонов Django. Шаблон, который мы используем, это add
. Он используется для того, чтобы добавить что-то к тому, что идет перед трубой. Если бы мы имели дело с числами, он бы сложил их математически, но поскольку мы используем строки, вместо этого он конкатенирует 2 строки. Аналогично последняя часть конкатенируется с первыми двумя частями и в итоге получается требуемый url.
Причина, по которой ваш метод не работал, заключалась в том, что вы пытались передать переменную {{i.index_ticker}}
в строку. Это создавало url, который буквально содержит форматерную версию {{i.index_ticker}}. Вот почему вы, вероятно, получали %7B%7Bi.index_ticker%7D%7D в url.