添加圖標到（鏈接）元/元素元素

Question

我需要創建渲染這個HTML元素，使圖標是a的內部HTML的一部分：

<li> 
    <a href="/pricing/de" id="de"> 
     <i class="fa fa-circle-o"></i>Deutschland 
    </a> 
</li> 

我現在方法如下

<li th:each="country : ${countryList}"> 
    <a th:href="@{country.getKey()}" th:text="${country.getValue()}"> 
     <i th:class="fa fa-square-o"></i> 
    </a> 
</li> 

但這當然覆蓋圖標與th:text。將圖標添加到文字似乎也不起作用...

我如何在百里香葉中做到這一點？

Answer 1

有很多方法可以解決這個問題。我可能會這樣做：

<li th:each="country : ${countryList}"> 
    <a th:href="@{country.key}" > 
     <i th:class="fa fa-square-o"></i><span th:text="${country.value}" /> 
    </a> 
</li> 

但是你可能不想要額外的跨度，所以你可以使用th：塊。

<li th:each="country : ${countryList}"> 
    <a th:href="@{country.key}"> 
     <i th:class="fa fa-square-o"></i><th:block th:text="${country.value}" /> 
    </a> 
</li> 

或者只是內聯文本本身。

<li th:each="country : ${countryList}"> 
    <a th:href="@{country.key}" th:inline="text"> 
     <i th:class="fa fa-square-o"></i>[[${country.value}]] 
    </a> 
</li> 

編輯：另外，如果你按JavaBean規範命名你的財產，你應該只使用。關鍵不是.getKey（）的