Question

我的模板

<div>
<ul>
{% for image in obj.images_set.all %} 
  <li class="col-lg-4 text-center">
     <a data-toggle="modal"data-target="#myModal{{forloop.counter0}}"> 
     <img src="{{ image.image.url }}" alt=""/></a>
  </li>

{% endfor %}

</ul>
</div>


{% for image in obj.images_set.all %}
<div id="myModal{{forloop.counter0}}" class="modal fade" 
role="dialog">
 <div class="modal-dialog" style="text-align:center;">
   <div class="modal-content" style="display:inline-block;">
       <img src="{{ image.image.url }}" alt=""/>
   </div>
 </div>
</div>
  {% endfor %}

我有一个任务列表。我遍历任务，一个obj代表一个任务。每个任务有多张图像（1,2或3）。列出了任务并且图像正确显示。我试图在单击内部的图像时显示模式弹出窗口任务。我使用for循环计数器为id指定了目标。问题是我无法以正确的图像为目标，因为im具有每个任务的图像列表...所以for循环对于图像来说像0,1,2在第一个任务中，然后在第二个任务中也为0,1,2，并且我无法为数据目标分配唯一的ID。我该如何克服呢？

Answer 1

<div>
<ul>
{% for image in obj.images_set.all %} 
  <li class="col-lg-4 text-center">
   <a data-toggle="modal"data-target="#myModal{{image.pk}} 
{{forloop.counter0}}"> 
  <img src="{{ image.image.url }}" alt=""/></a>
  </li>

{% endfor %}

</ul>
</div>


{% for image in obj.images_set.all %}
<div id="myModal{{ image.pk }}{{forloop.counter0}}" class="modal fade" 
 role="dialog">
<div class="modal-dialog" style="text-align:center;">
 <div class="modal-content" style="display:inline-block;">
    <img src="{{ image.image.url }}" alt=""/>
 </div>
</div>
</div>
 {% endfor %}

解决了这个问题。只需将image.pk添加到id nad就能使id唯一

在Django模板中为模式指定正确的图像

1 个答案: