Как узнать, когда загрузка завершится?

Для того чтобы дожидаться полной загрузки изображений, вы можете использовать событие `load` для каждого изображения после того, как завершится основной запрос данных. После завершения всех загрузок изображений, вы можете скрыть лоадер.

Вот пример подхода, который вы можете использовать:

1. Запустите запрос данных и отображайте лоадер.
2. После получения данных, создайте изображения и добавьте обработчик события `load` для каждого изображения.
3. Используйте счетчик, чтобы отслеживать, сколько изображений уже загрузилось. Когда все изображения будут загружены, скрывайте лоадер.

Вот пример кода на JavaScript:

```javascript
function loadImages(imageUrls) {
    const loader = document.getElementById('loader');
    loader.style.display = 'block'; // Показываем лоадер

    let loadedImagesCount = 0;
    const totalImages = imageUrls.length;

    // Функция для проверки завершения загрузки всех изображений
    function checkAllImagesLoaded() {
        if (loadedImagesCount === totalImages) {
            loader.style.display = 'none'; // Скрываем лоадер
        }
    }

    imageUrls.forEach(url => {
        const img = new Image();
        img.src = url;

        // Увеличиваем счетчик после загрузки каждого изображения
        img.onload = () => {
            loadedImagesCount++;
            checkAllImagesLoaded();
        };

        // Обработка ошибки загрузки, чтобы не зависать в случае ошибки
        img.onerror = () => {
            loadedImagesCount++;
            checkAllImagesLoaded();
        };

        // Добавляем изображение на страницу, если необходимо
        document.body.appendChild(img);
    });
}

// Пример использования
const imageUrls = [
    'image1.jpg',
    'image2.jpg',
    'image3.jpg'
];

fetch('api/data/endpoint') // Замените на ваш API
    .then(response => response.json())
    .then(data => {
        // Обработка данных
        // Предположим, data содержит нужные ссылки на изображения
        loadImages(data.imageUrls);
    })
    .catch(error => {
        console.error('Ошибка:', error);
        // Можно также скрыть лоадер в случае ошибки
        loader.style.display = 'none';
    });
```

Этот код сначала показывает лоадер. После загрузки всех изображений и их обработки он скрывает лоадер. В случае ошибки загрузки изображения счетчик также увеличивается, чтобы избежать зависания.