Как я могу интерполировать строку из переменной в успехе метки начальной загрузки с помощью тимелеафа

У меня есть следующий html-контент:

<span th:if = "${game.isWon()}" class = "label label-success">
        YOU WIN! Game Score: ${game.getGameScore()}.</span>

Я не могу понять, как интерполировать game.getGameScore(), и необработанная строка продолжает отображаться. Я использую тимелеаф с Spring Boot. Любая помощь приветствуется.

Используйте th:text = "..." внутри тега как атрибут, а не как содержимое между <span> и </span>. Кроме того, если ваши геттеры настроены правильно, вы можете просто использовать имена полей (например, won вместо isWon()).

andrewJames 13.12.2020 01:30

Например: <span th:if = "${game.won}" th:text = "'YOU WIN! Game Score: ' + ${game.gameScore} + '.'"></span> (не проверено).

andrewJames 13.12.2020 01:30

выдает 500. Пожалуйста, воздержитесь от публикации непроверенного кода.

Boris 13.12.2020 20:46

Понял - извините. Я опубликовал проверенный подход.

andrewJames 13.12.2020 21:09
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
В настоящее время производительность загрузки веб-сайта имеет решающее значение не только для удобства пользователей, но и для ранжирования в...
Введение в CSS
Введение в CSS
CSS является неотъемлемой частью трех основных составляющих front-end веб-разработки.
Как выровнять Div по центру?
Как выровнять Div по центру?
Чтобы выровнять элемент <div>по горизонтали и вертикали с помощью CSS, можно использовать комбинацию свойств и значений CSS. Вот несколько методов,...
Навигация по приложениям React: Исчерпывающее руководство по React Router
Навигация по приложениям React: Исчерпывающее руководство по React Router
React Router стала незаменимой библиотекой для создания одностраничных приложений с навигацией в React. В этой статье блога мы подробно рассмотрим...
Система управления парковками с использованием HTML, CSS и JavaScript
Система управления парковками с использованием HTML, CSS и JavaScript
Веб-сайт по управлению парковками был создан с использованием HTML, CSS и JavaScript. Это простой сайт, ничего вычурного. Основная цель -...
Toor - Ангулярный шаблон для бронирования путешествий
Toor - Ангулярный шаблон для бронирования путешествий
Toor - Travel Booking Angular Template один из лучших Travel & Tour booking template in the world. 30+ валидированных HTML5 страниц, которые помогут...
0
4
228
2
Перейти к ответу Данный вопрос помечен как решенный

Ответы 2

Ответ принят как подходящий

Если вы хотите использовать атрибуты непосредственно в тексте (а не в атрибутах HTML), вы должны использовать встраивание, которое имеет свой собственный синтаксис. (Обратите внимание, что встраивание включено по умолчанию в Thymeleaf 3, но вам, возможно, придется использовать атрибут th:inline = "text" в более ранних версиях). Например:

<span th:if = "${game.won}" class = "label label-success">
    YOU WIN! Game Score: [[${game.gameScore}]].
</span>

Традиционный способ сделать это — просто добавить несколько дополнительных тегов:

<span th:if = "${game.won}" class = "label label-success">
    YOU WIN! Game Score: <span th:text = "${game.gameScore}" />.
</span>

Предполагая, что у вас есть игровой компонент, используя поля won и gameScore с соответствующими геттерами:

public class Game {
    
    private boolean won;
    private int gameScore;

    public boolean isWon() {
        return won;
    }

    public void setWon(boolean won) {
        this.won = won;
    }

    public int isGameScore() {
        return gameScore;
    }

    public void setGameScore(int gameScore) {
        this.gameScore = gameScore;
    }
    
}

Затем вы можете использовать это:

<span th:if = "${game.won}" 
      th:text = "'YOU WIN! Game Score: ' + ${game.gameScore} + '.'" 
      class = "label label-success">
</span>

Это генерирует следующий HTML:

<span class = "label label-success">YOU WIN! Game Score: 123.</span>

Другие вопросы по теме