机车cms液体模板逻辑问题答案

【问题标题】：locomotive cms liquid template logic issue机车cms液体模板逻辑问题
【发布时间】：2013-07-12 17:25:22
【问题描述】：

我正在尝试达到以下结果：

我有一个 carousel_images 模型，它有_many“标签”。我只想在满足条件的轮播中显示图像。我尝试了很多不同的方法，最接近的方法是使用下面的代码，但是，它显示了每个标签的图像，而不是每个标签仅显示一个。

<div class="span12">
    <div id ="myCarousel" class="carousel slide">
        <div class="carousel-inner">
            {% for caro in contents.caro_images %}
                {% assign first_loop = forloop.index0 %}                  
                {% for tag in caro.tags %}
                    {% if tag.tag_name|downcase contains page.slug %}
                        <div class="{% if first_loop%}active {% endif %}item">
                            <a href="{{ caro.url}}">
                                <img src="{{ caro.image.url }}" width="720" height="316" alt="">
                            </a>
                        </div>
                    {% endif %}
                {% endfor %}         
             {% endfor %}
             <a style="display:none;" class="left carousel-control" href="#myCarousel" data-slide="prev">‹</a>
             <a style="display:none;" class="right carousel-control" href="#myCarousel" data-slide="next">›</a>
        </div>
    </div>
</div>

我意识到这与在内部 for 循环检查标签内显示的实际图像有关，但我真的不知道如何在该循环之外进行检查并让图像只显示一次。

我也不是 100% 确定如何正确设置“活动”类，因为它嵌套在辅助附加循环中。

提前致谢！

编辑---- 这是工作代码：

<div class="span12">
  <div id ="myCarousel" class="carousel slide">
    <div class="carousel-inner">
      {% for caro in contents.caro_images %}
      {% assign first_loop = forloop.index0 %}
        {% for tag in caro.tags %}
          {% if tag.tag_name == page.slug %}
            <div class="{% if first_loop == 0 %}active {% endif %}  item">
              <a href="{{ caro.url}}">
                <img src="{{ caro.image.url }}" width="720" height="316" alt="">
              </a>
            </div>
          {% endif %}
        {% endfor %} 
      {% endfor %}
      <a style="display:none;" class="left carousel-control" href="#myCarousel" data-slide="prev">‹</a>
      <a style="display:none;" class="right carousel-control" href="#myCarousel" data-slide="next">›</a>
    </div>
  </div>
</div>

我认为无休止的应用重新启动也可能有助于工作正常。

【问题讨论】：

标签： html ruby-on-rails template-engine liquid locomotivecms

【解决方案1】：

我最终通过大量的试验和错误来稍微改变结构，但最终让它工作。更新的代码正在编辑中，以防其他人遇到此问题。

【讨论】：

【解决方案2】：

我认为这会更好地处理客户端与 javascript。也许看看其中一些：45+ carousel plugins.

【讨论】：

我正在使用 twitter-bootstrap 的轮播插件，但我需要在其中插入特定的内容。这是我遇到的麻烦，但已经排序了。