จะทำอย่างไรถ้าอย่างอื่นใน Thymeleaf?


132

เป็นวิธีที่ดีที่สุดที่จะทำง่ายif- elseใน Thymeleaf?

ฉันต้องการประสบความสำเร็จใน Thymeleaf เช่นเดียวกับ

<c:choose>
  <c:when test="${potentially_complex_expression}">
     <h2>Hello!</h2>
  </c:when>
  <c:otherwise>
     <span class="xxx">Something else</span>
  </c:otherwise>
</c:choose>

ใน JSTL

สิ่งที่ฉันได้คิดไปแล้ว:

<div th:with="condition=${potentially_complex_expression}" th:remove="tag">
    <h2 th:if="${condition}">Hello!</h2>
    <span th:unless="${condition}" class="xxx">Something else</span>
</div>

ฉันไม่ต้องการประเมินpotentially_complex_expressionสองครั้ง conditionนั่นเป็นเหตุผลที่ผมแนะนำตัวแปรท้องถิ่น ยังคงฉันไม่ชอบใช้ทั้งและth:if="${condition}th:unless="${condition}"

สิ่งที่สำคัญก็คือว่าผมใช้สองแท็กที่แตกต่างกัน: สมมติว่าและh2span

คุณสามารถแนะนำวิธีที่ดีกว่าในการบรรลุเป้าหมายได้หรือไม่?

คำตอบ:


208

Thymeleaf มีค่าเทียบเท่า<c:choose>และ<c:when>: th:switchและth:caseคุณลักษณะที่แนะนำใน Thymeleaf 2.0

มันทำงานได้ตามที่คุณคาดหวังใช้*สำหรับกรณีเริ่มต้น:

<div th:switch="${user.role}"> 
  <p th:case="'admin'">User is an administrator</p>
  <p th:case="#{roles.manager}">User is a manager</p>
  <p th:case="*">User is some other thing</p> 
</div>

ดูนี่สิสำหรับคำอธิบายโดยย่อเกี่ยวกับไวยากรณ์ (หรือแบบฝึกหัด Thymeleaf)

ข้อจำกัดความรับผิดชอบ : ตามกฎของ StackOverflow ฉันเป็นผู้เขียน Thymeleaf


ตกลง แต่ .. ฉันจะเรียกใช้จาวาสคริปต์ตามประเภทของลูกค้า (เช่นไม่ระบุชื่อหรือเข้าสู่ระบบ) ...
Lucky

1
ดูบทเกี่ยวกับ "การแทรกข้อความ" โดยเฉพาะส่วน "การแทรกจาวาสคริปต์" ที่บท "ใช้ Thymeleaf" ในthymeleaf.org/documentation.html
Daniel Fernández

และฉันจะทำอย่างไร: สลับค่า iterator.index ฉันต้องการทำชุดกรณีเมื่อค่าเป็น <5 และเปลี่ยนเป็นกรณีเริ่มต้นหากค่าคือ> 5
Loser Coder

@ DanielFernández: คุณช่วยฉันด้วยstackoverflow.com/questions/48499723/ได้ไหม ฉันไม่สามารถแท็กคุณกับคำถามโดยตรง ติดจริงๆ
ท่าเทียบเรือ

98

ฉันลองรหัสนี้เพื่อดูว่าลูกค้าเข้าสู่ระบบหรือไม่ระบุชื่อ ฉันใช้นิพจน์th:ifและth:unlessเงื่อนไขแบบมีเงื่อนไข วิธีง่ายๆในการทำ

<!-- IF CUSTOMER IS ANONYMOUS -->
<div th:if="${customer.anonymous}">
   <div>Welcome, Guest</div>
</div>
<!-- ELSE -->
<div th:unless="${customer.anonymous}">
   <div th:text=" 'Hi,' + ${customer.name}">Hi, User</div>
</div>

5
สิ่งนี้ไม่ได้ตอบคำถามของ OP เนื่องจากเป็นเรื่องเกี่ยวกับการหลีกเลี่ยงการทำซ้ำนิพจน์ที่ซับซ้อน และเช่นเดียวกับโซลูชันอื่น ๆ นี่เป็นแนวคิด "เทมเพลตธรรมชาติ" ซึ่งเป็นจุดขายที่สำคัญของ Thymeleaf ไม่แน่ใจว่าจะทำอย่างไรกับตัวเอง แต่ต้องการชี้ให้เห็นในกรณีที่มีใครบางคนมีคำตอบ
Stephen Harrison

@ Lucky นี่ทำให้ฉันมีข้อผิดพลาด EL1007E: (pos 0): ไม่พบทรัพย์สินหรือฟิลด์ 'สถานะ'
Jesse

@Jackie ในตัวอย่างข้างต้นลูกค้าเป็นวัตถุและไม่ระบุชื่อเป็นฟิลด์บูลีนในระดับลูกค้า ตรวจสอบให้แน่ใจว่าวัตถุของคุณไม่เป็นโมฆะและชื่อเขตข้อมูลถูกต้อง
โชคดี

25

ฉันต้องการแบ่งปันตัวอย่างที่เกี่ยวข้องกับความปลอดภัยนอกเหนือจาก Daniel Fernández

<div th:switch="${#authentication}? ${#authorization.expression('isAuthenticated()')} : ${false}">
    <span th:case="${false}">User is not logged in</span>
    <span th:case="${true}">Logged in user</span>
    <span th:case="*">Should never happen, but who knows...</span>
</div>

นี่คือนิพจน์ที่ซับซ้อนพร้อมทั้งยูทิลิตี้ 'การตรวจสอบความถูกต้อง' และ 'การอนุญาต' ออบเจ็กต์ซึ่งสร้างผลลัพธ์ที่ 'จริง / เท็จ' สำหรับโค้ดเทมเพลตไทม์แมลีฟ

'การรับรองความถูกต้อง' และ 'อนุมัติ' ยูทิลิตี้วัตถุมาจากห้องสมุดแถม thymeleaf springsecurity3 เมื่อวัตถุ 'การรับรองความถูกต้อง' ไม่พร้อมใช้งานหรือ authentication.expression ('isAuthenticated ()') จะประเมินเป็น 'false' นิพจน์จะคืนค่า $ {false} มิฉะนั้น $ {true}


19

คุณสามารถใช้ได้

If-then-else:  (if) ? (then) : (else)

ตัวอย่าง:

'User is of type ' + (${user.isAdmin()} ? 'Administrator' : (${user.type} ?: 'Unknown'))

มันอาจมีประโยชน์สำหรับคนใหม่ที่ถามคำถามเดียวกัน


11

โซลูชันอื่น - คุณสามารถใช้ตัวแปรโลคอล:

<div th:with="expr_result = ${potentially_complex_expression}">
    <div th:if="${expr_result}">
        <h2>Hello!</h2>
    </div>
    <div th:unless="${expr_result}">
        <span class="xxx">Something else</span>
    </div>
</div>

เพิ่มเติมเกี่ยวกับตัวแปรท้องถิ่น:
http://www.thymeleaf.org/doc/tutorials/2.1/usingthymeleaf.html#local-variables


ฉันคิดว่าคุณได้เพิ่มเครื่องหมาย "=" พิเศษในรหัสของคุณ โปรดยืนยันอีกครั้งและแก้ไขให้ถูกต้องหากฉันถูก
Lucky

ในรหัสความคิดเห็นของฉันก็โอเค ฉันไม่ทราบว่าคุณหมายถึงเครื่องหมาย '=' พิเศษใด
jareks

ใช่รหัสก็โอเค ขออภัยฉันสับสนกับth:eachที่มีการแสดงออก:แทน=
โชคดี

แต่คำตอบนี้อยู่ใกล้กับโซลูชันของฉันมาก ในขณะที่ทำ th: ด้วยการแสดงออกดูเหมือนจะซ้ำซ้อนกับฉัน โดยพื้นฐานแล้ววิธีนี้ใช้ th: if และ th: เว้นแต่ข้อความสั่งแบบมีเงื่อนไข
Lucky

ฉันคิดว่ามันไม่ซ้ำซ้อน ถ้าคุณใช้เพียง Th: ถ้า Th: เว้นแต่การแสดงออกที่ซับซ้อนจะได้รับการดำเนินการเป็นครั้งที่สอง ...
jareks

9

ในกรณีที่ง่ายกว่า (เมื่อแท็ก html เหมือนกัน):

<h2 th:text="${potentially_complex_expression} ? 'Hello' : 'Something else'">/h2>

คุณรู้วิธีเพิ่มการแปลสำหรับ 'Hello' และ 'Something else' ในนิพจน์นี้หรือไม่?
ลอร่า

@Laura คุณสามารถใช้ความเป็นสากลและโหลดการแปลภาษาที่แตกต่างกันขึ้นอยู่กับที่ตั้งจากไฟล์คุณสมบัติ ดูlooksok.wordpress.com/tag/internationalization , marcelustrojahn.com
โชคดี

7

อีกวิธีคือใช้notเพื่อให้ได้ผลตรงกันข้าม:

<h2 th:if="${potentially_complex_expression}">Hello!</h2>
<span class="xxx" th:if="${not potentially_complex_expression}">Something else</span>

ตามที่อธิบายไว้ในเอกสารth:unlessก็เป็นสิ่งเดียวกันกับการใช้ ตามคำตอบอื่น ๆ ได้อธิบาย:

นอกจากนี้ยังth:ifมีแอตทริบิวต์ผกผันth:unlessซึ่งเราสามารถใช้ในตัวอย่างก่อนหน้านี้แทนที่จะใช้ไม่ใช่ภายในนิพจน์ OGNL

ใช้notยังทำงาน แต่ IMHO ก็สามารถอ่านได้มากขึ้นเพื่อใช้แทนการกวนสภาพด้วยth:unlessnot


2
<div th:switch="${user.role}"> 
<p th:case="'admin'">User is an administrator</p>
<p th:case="#{roles.manager}">User is a manager</p>
<p th:case="*">User is some other thing</p> 
</div>


<div th:with="condition=${potentially_complex_expression}" th:remove="tag">
<h2 th:if="${condition}">Hello!</h2>
<span th:unless="${condition}" class="xxx">Something else</span>
</div>


1

ใช้th:switchเป็นif-else

<span th:switch="${isThisTrue}">
  <i th:case="true" class="fas fa-check green-text"></i>
  <i th:case="false" class="fas fa-times red-text"></i>
</span>

ใช้th:switchเป็นswitch

<span th:switch="${fruit}">
  <i th:case="Apple" class="fas fa-check red-text"></i>
  <i th:case="Orange" class="fas fa-times orange-text"></i>
  <i th:case="*" class="fas fa-times yellow-text"></i>
</span>
โดยการใช้ไซต์ของเรา หมายความว่าคุณได้อ่านและทำความเข้าใจนโยบายคุกกี้และนโยบายความเป็นส่วนตัวของเราแล้ว
Licensed under cc by-sa 3.0 with attribution required.