如何使用Twig获取HTML类名并在IF条件中实现动态文本展示
实现Twig根据元素类名显示特定文本的方案
没问题,这个需求完全可以实现,不过先看看你现有代码里的几个小问题:一是elseif if是语法错误(多了个if),二是直接判断完整的class字符串不够灵活——如果后续给元素加了其他类名,这个判断就会失效。下面给你两种靠谱的实现方案:
方案一:直接使用控制类名的源变量(推荐)
既然你的元素类名是由route_type这个变量决定的,那完全没必要绕去解析最终的class值,直接用route_type做判断逻辑更清晰,代码也更易维护:
<!-- 根据route_type生成对应的类名 --> <div class="{{ route_type ? 'zboruri_intoarcere' : 'zboruri_plecare' }}"> <!-- 直接判断route_type来显示文本 --> {% if route_type %} <p>Departure</p> {% else %} <p>Arrival</p> {% endif %} </div>
如果route_type不是布尔值,而是具体的字符串(比如'departure'或'arrival'),可以调整成更明确的判断:
<div class="{{ route_type == 'departure' ? 'zboruri_intoarcere' : 'zboruri_plecare' }}"> {% if route_type == 'departure' %} <p>Departure</p> {% else %} <p>Arrival</p> {% endif %} </div>
方案二:根据最终生成的class值判断(适合复杂场景)
如果你的class是多个动态因素生成的,必须基于最终的class字符串判断,那可以先把class存到变量里,再用Twig的in操作符检查是否包含目标类名:
{% set element_classes = route_type ? 'zboruri_intoarcere' : 'zboruri_plecare' %} <!-- 这里如果有固定类名可以直接拼接,比如: {% set element_classes = "zboruri_rute " ~ (route_type ? 'zboruri_intoarcere' : 'zboruri_plecare') %} --> <div class="{{ element_classes }}"> {% if 'zboruri_intoarcere' in element_classes %} <p>Departure</p> {% elseif 'zboruri_plecare' in element_classes %} <p>Arrival</p> {% endif %} </div>
这个方法的好处是,哪怕后续给元素加了额外的类名(比如zboruri_rute active),只要包含目标类,判断依然有效,比硬匹配完整字符串灵活得多。
内容的提问来源于stack exchange,提问作者BilendM
相关产品推荐
相关产品推荐

