逻辑流if / else

时间:2018-12-07 17:17:07

标签: css if-statement logic shopify liquid

如何从液体逻辑标记中删除管道(|? 我有一个包含液态逻辑的div,该逻辑最多可提取3个电话号码,并在每个电话号码的末尾加上|以将它们分开。如果用户只有一个电话号码,则他们希望删除管道(|" |  "标签。

<div class="phones">

      <p>{% if user.settings.phone_office %}<span 
          class="red">O</span>&nbsp;   <br />  
          {{user.settings.phone_office}}&nbsp;| &nbsp;
         {% endif %}

         {% if user.settings.phone_cell %}<span
         class="red"> C</span>&nbsp; 
         {{user.settings.phone_cell}}&nbsp;| &nbsp;
         {% endif %}

         {% if user.settings.phone_fax %}<span 
         class="red">F</span>&nbsp;{{user.settings.phone_fax}}
         {% endif %}</p>
 </div>

1 个答案:

答案 0 :(得分:0)

不要将"&nbsp;| &nbsp;"放在每个项目的末尾,而要放在它的开始。仅当有新数字时才显示分隔符。以下是一个示例:

<div class="phones">
    <p>
        {% if user.settings.phone_office %}
            <span class="red">O</span>&nbsp;  
            {{user.settings.phone_office}}
        {% endif %}

        {% if user.settings.phone_cell %}
            &nbsp;| &nbsp<span class="red"> C</span>&nbsp; 
            {{user.settings.phone_cell}}
        {% endif %}

        {% if user.settings.phone_fax %}
            &nbsp;| &nbsp<span class="red"> F</span>&nbsp; 
            {{user.settings.phone_fax}}
        {% endif %}
    </p>
</div>