Javascript 如何使用<；i>；带三元运算符的标记？

我尝试将“I”标记与三元运算符一起使用。两个字符串“unavailable”、“available”工作得很好，但是我想使用两个图标，比如一个复选标记（fa-fa-check）和一个X标记（fa-fa-times）

任何帮助都将不胜感激

<td th:text="${phone.assigned == true ? 'unavailable' : 'available'}" >Availability</td>

<td class="checkSign"><i class="fa fa-check" aria-hidden="true"></i></td>
<td class="xSign"><i class="fa fa-times" aria-hidden="true"></i></td>

可用性

尝试使用

th:classappend

<td class="checkSign"><i class="fa" th:classappend="${phone.assigned} ? fa-check : fa-times" aria-hidden="true"></i></td>

可用性

使用IF

<td>
  <i th:if="${phone.assigned == true}" class="fa fa-check" aria-hidden="true"></i>
  <i th:if="${phone.assigned == false}" class="fa fa-times" aria-hidden="true"></i> 
</td>

---

正确的方法是执行以下操作：

th:classappend

（另一个答案是在可能导致错误的值周围缺少引号）。这项工作：

<td>
  <i class="fa" th:classappend="${phone.assigned ? 'fa-check' : 'fa-times'}" aria-hidden="true"></i>
</td>

或者这个：

<td>
  <i th:if="${phone.assigned}" class="fa fa-check" aria-hidden="true"></i>
  <i th:unless="${phone.assigned}" class="fa fa-times" aria-hidden="true"></i> 
</td>

---

我知道这已经快2年了，但如果有人需要的话。 我是这样用的

<td>
 <i th:class="${phone.assigned}?'fa fa-check':'fa fa times'" aria-hidden="true"></i>
</td>

您使用的是哪种框架？是。我使用的是thymeleaf。我相信您在实际类名周围缺少引号。

<td>
  <i th:if="${phone.assigned}" class="fa fa-check" aria-hidden="true"></i>
  <i th:unless="${phone.assigned}" class="fa fa-times" aria-hidden="true"></i> 
</td>

<td>
 <i th:class="${phone.assigned}?'fa fa-check':'fa fa times'" aria-hidden="true"></i>
</td>