How to concatenate th:text and static content with html tags in Thymeleaf?

Question

<div th:switch="${data.totalPercentage}">
    <td th:case="100" th:text="${data.totalPercentage}"/>
    <td th:case="*" th:text="${data.totalPercentage + '*'}" class="alert alert-warning font-weight-bold"/>
</div>

Above expression works but I can not concatenate html tag with th:text. I would like to replace * with fontawesome flag icon <i class="fas fa-flag"></i>. Any suggestion?

Answer 1

No real reasons to concatenate here, you should be thinking in terms of HTML.

<div th:switch="${data.totalPercentage}">
  <td th:case="100" th:text="${data.totalPercentage}"/>
  <td th:case="*" class="alert alert-warning font-weight-bold">
    <span th:text="${data.totalPercentage}" /> <i class="fas fa-flag"></i>
  </td>
</div>