Могу ли я остановить forEach, пока не получу данные с сервера с тогда обещанием? - PullRequest
0 голосов
/ 09 июня 2018

Я пытаюсь получить img url с сервера, используя promise-then, и обновить другой объект с этим img url на сервере.

Однако я не могу обновить данные, потому что функция для обновленияданные запускаются перед загрузкой URL, поэтому он возвращает null.

Итак, я думаю, что если бы я мог остановить выполнение forEach до тех пор, пока не получу imgUrl, тогда все будет работать хорошо.

Вотмой код


store.service.ts

addStoreImgList(imgArr, storeName) {
  const menuUrls = this.getStoreMenuImgUrl(imgArr.imgList, storeName);
  const normalUrls = this.getStoreNormalImgUrl(imgArr.normalImgList, storeName);

  return {menuUrls, normalUrls};
}

getStoreMenuImgUrl(menuImg, storeName) {
  const menuUrls = [];
  menuImg.forEach(item => {
    const imgRef = this.storageRef.child(`store/menuImg/${storeName}/${item.name}`);
    imgRef.put(item).then((snapshot) => menuUrls.push(snapshot.downloadURL));
  }); // Can I stop menuImg.forEach until I get a data from server here?

  return menuUrls;
}

getStoreNormalImgUrl(normalImg, storeName) {
  const normalUrls = [];
  normalImg.forEach(item => {
    const imgRef = this.storageRef.child(`store/normalImg/${storeName}/${item.name}`);
    imgRef.put(item).then((snapshot) => normalUrls.push(snapshot.downloadURL));
  });

  return normalUrls;
}

edit-store.component.ts

const urls = this.storeService.addStoreImgList(imgArr, this.storeName);

Если бы вы могли дать лучший совет, я был бы признателен вам.Я действительно пытался использовать observable в rxjs, но не смог.

Спасибо!

1 Ответ

0 голосов
/ 09 июня 2018

Нет простого и легкого способа сделать это с "ванильными" обещаниями.Вы можете сделать это, но для этого необходимо составить список обещаний и объединить их в цепочку.Такой код может стать очень уродливым и сложным очень быстро.

Самый простой способ сделать это - использовать синтаксис async await.

То, что вы ищете, должновыглядеть примерно так:

async getStoreMenuImgUrl(menuImg, storeName) {
  const menuUrls = [];
  for (const item of menuImg) {
    const imgRef = this.storageRef.child(`store/menuImg/${storeName}/${item.name}`);
    const snapshot = await imgRef.put(item);
    menuUrls.push(snapshot.downloadURL);
  }

  return menuUrls;
}
...