Как последовательно загрузить модели в главный контейнер?

Question

[Alisa94]

Доброе утро. Я практически не разбираюсь в промисах и асинхронных функция, поэтому решил спросить вас. Проблема простая, но для меня решить её трудно из-за не хватки знаний. Я посмотрел работу промисов и асинхронных функций, но это мне ничего не дало.
Вот в чём проблема. У меня есть массив, в котором хранятся urn моделей. Я загружаю модели в главный контейнер используя их urn, но это, как понятно, происходит асинхронно. Мне же нужно, чтобы сперва загружалась первая модель, т.е. первый urn, а потом вторая. Вот мой код, которой работает асинхронно.

arrId.map(model => {
  Autodesk.Viewing.Document.load(model, onDocumentLoadSuccess, onDocumentLoadFailure);
});

Для меня важнее понять принцип работы, поэтому вы можете просто показать, как это будет работать с чем-то другим, например картинкой или чем-то иным.

Заранее благодарен.

Answer 1

[inzeppelin]

Судя по всему, у вас есть событие onDocumentLoadSuccess. Вы можете использовать его, чтобы реализовать загрузку моделей по очереди. В самой простой и наглядной реализации можно сделать что-то вроде:

// это начальный индекс модели
const i = 0;

// коллбэк на успешную загрузку
const onDocumentLoadSuccess = () => {
  i++;
  (if arrId[i]) {
    loader(i);
  } else {
    alert('все модели загружены');
  }
};

// функция принимает индекс модели в массиве и запускает лоадер
const loader = (modelIndex) => {
  Autodesk.Viewing.Document.load(arrId[modelIndex], onDocumentLoadSuccess, onDocumentLoadFailure);
};

// запускаем лоадер для нулевого элемента
loader(i);

Соответственно сначала отработает первая модель, сработает коллбэк успешной загрузки, мы инкрементируем индекс и запускаем вторую модель, и т.д. до тех пор пока не загрузим все модели.