@postya

Как автоматически вывести все блоки в thymeleaf?

Пишу проект на Spring Boot, шаблонизатор Thymeleaf.
БД - Postgresql

На одной странице мне нужно показывать много разных видео. В базе данных будет хранится название видео и ссылка на него.

Как можно вывести все видео одновременно , чтобы мне каждый раз не создавать в html новый блок для видео с его названием?

HTML:

<div class="video-container">
        <div class="video-item">
            <iframe src="https://www.youtube.com/embed/b4sG5h_Coa4n"
                    frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture"
                    allowfullscreen></iframe>
            <h3>Банки</h3>
        </div>

        <div class="video-item">
            <iframe src="https://www.youtube.com/embed/-atblwgc63E"
                    frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture"
                    allowfullscreen></iframe>
            <h3>Банки</h3>
        </div>
</div>


Модель таблицы БД:

@Entity
@Table(name = "video")
@Data
@NoArgsConstructor
@AllArgsConstructor
public class Video {

    @Id
    @GeneratedValue(strategy = GenerationType.IDENTITY)
    private int id;

    @Column(name = "title")
    private String title;

    @Column(name = "url")
    private String url;
}


Контроллер:

@Controller
public class HomeController {
    
    @GetMapping("/tutorials")
    public String tutorials() {
        return "tutorials";
    }
}
  • Вопрос задан
  • 37 просмотров
Решения вопроса 1
@Kot1que
Вообще по-хорошему добавить еще слой сервисов, но для простоты примера не стал.

public interface VideoRepository extends CrudRepository<Video, Integer> {
}


@Controller
public class HomeController {
    @Autowired
    private final VideoRepository videoRepository;

    @GetMapping("/tutorials")
        public String tutorials(Model model) {
            model.add("videos", videoRepository.findAll());
            return "tutorials";
        }
}


<div class="video-container">
        <div class="video-item" th:each="video: ${videos}">
            <iframe th:src="${video.url}"
                    frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture"
                    allowfullscreen></iframe>
            <h3 th:text="${video.title}"></h3>
        </div>
</div>
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы