Карусель изображений, сложенных с помощью начальной загрузки

Question

Я использую Bootstrap 4.3.1. Я пытаюсь создать простую карусель. Изображения складываются, и я не могу найти решение. Я пробовал решения из других постов, но ни один из них не работал вообще.

HTML:

<div th:if="${activeCarousel} eq 'active'" >
            <div id="myCarousel" class="carousel slide" data-ride="carousel">
                <!-- Wrapper for slides -->
                <div class="carousel-inner">
                    <div class="carousel-item active">
                        <img class="center-block" th:src="${firstImage.image}" alt="Image"
                            style="width: 50%;">

                    </div>
                    <div class="carousel-item" th:each="image : ${Images}">
                        <img class="center-block" th:src="${image.image}" alt="Image"
                            style="width: 50%;">

                    </div>
                </div>

                <!-- Left and right controls -->
                <a class="left carousel-control" href="#myCarousel" role="button"
                    data-slide="prev"> <span
                    class="glyphicon glyphicon-chevron-left"></span> <span
                    class="sr-only">Previous</span>
                </a> 
                <a class="right carousel-control" href="#myCarousel" role="button"
                    data-slide="next"> <span
                    class="glyphicon glyphicon-chevron-right"></span> <span
                    class="sr-only">Next</span>
                </a>
            </div>
    </div>

Я использую Spring MVC и Thymeleaf. Мой класс контроллеров:

@GetMapping(path = "/myProfile")
public final String getMyProfile(ModelMap model) {
    Authentication authentication = SecurityContextHolder.getContext().getAuthentication();
    User user = getUserService().findByUsername(authentication.getName());

    List<ImageDto> imagesDto = getImageService().imageListToImageDtoListConversor
            (getImageService().getImagesByUserId(user.getId()));
    model.put("currentUser", user);
    if (imagesDto.size() > 0) {
        model.put("activeCarousel", "active");
        model.put("firstImage", imagesDto.get(0));
        imagesDto.remove(0);
        model.put("Images", imagesDto);
    }
    return EntityViewConstants.VIEW_ENTITY_MY_PROFILE;
}