then()函数Promise.all在promises完成之前执行 - Ionic / Angular

时间:2017-10-24 23:04:36

标签: angular typescript caching ionic-framework promise

我是第一次使用ionic设置缓存。这是代码:

listProducts(): Promise < any > {
    let cacheKey = 'products';
    this.cache.removeItem(cacheKey);
    let promises_array:Array<any> = [];
    let results;
    return new Promise((resolve, reject) => {
        this.cache.getItem(cacheKey).catch(() => {
            this.list = this.af.list('/products');
            this.subscription5 = this.list.subscribe(items => {
                for (let x = 0; x < items.length; x++) {
                    promises_array.push(new Promise((resolve, reject) => {
                        console.log(JSON.stringify(items[x].customMetadata) + ":   this is the customdata (((()()()()()");
                        let storageRef = firebase.storage().ref().child('/settings/' + items[x].customMetadata.username + '/profilepicture.png');
                        storageRef.getDownloadURL().then(url => {
                            console.log(url + "in download url !!!!!!!!!!!!!!!!!!!!!!!!");
                            items[x].customMetadata.profilepic = url;
                        }).catch((e) => {
                            console.log("in caught url !!!!!!!$$$$$$$!!");
                            items[x].customMetadata.profilepic = 'assets/blankprof.png';
                        });
                        //this.startAtKey = item.$key;
                        this.productListArray.push(items[x].customMetadata);
                    }));
                };
            })
            results = Promise.all(promises_array);
            results.then(() => {
                //setTimeout(() => {
                console.log(JSON.stringify(this.productListArray) + " value value vlaue productlistarray");
                this.productListArray.reverse();
                return this.cache.saveItem(cacheKey, this.productListArray);
                //}, 3000);
            })
        }).then(data => {
            console.log("Saved data: ", data);
            resolve();
        })
    })
}

基本上,行console.log(JSON.stringify(this.productListArray) + " value value vlaue productlistarray");打印一个空数组 - []。此变量中应该有数据,因为在完成所有承诺之前代码不应该执行。您注意到我已经注释了setTimeout - 当我对其进行评论时,它有效 - 但这显然不是一个可接受的解决方案,我只是表明它与承诺的时间问题。任何帮助都会很棒。

1 个答案:

答案 0 :(得分:0)

我认为问题出在这一行

this.list.subscribe(items => {

基本上,列表仍在

时获取
console.log(JSON.stringify(this.productListArray) + " value...

正在运行。所以我希望promises_array为空(你可以检查出来)。

您可以通过将list(map()或flatMap()(需要检查哪些)映射到promises数组而不是推送单个promises来对其进行排序。

我认为这是map(或flatMap)代码,但需要测试。请注意,每个缩进级别都需要大量返回。

const promises_array = this.list.map(items => {
  return items.map(item => {
    return new Promise((resolve, reject) => {
      console.log(JSON.stringify(items[x].customMetadata) + ":   this is the customdata (((()()()()()");
      let storageRef = firebase.storage().ref().child('/settings/' + items[x].customMetadata.username + '/profilepicture.png');
      return storageRef.getDownloadURL().then(url => {
        console.log(url + "in download url !!!!!!!!!!!!!!!!!!!!!!!!");
        items[x].customMetadata.profilepic = url;
      }).catch((e) => {
        console.log("in caught url !!!!!!!$$$$$$$!!");
        items[x].customMetadata.profilepic = 'assets/blankprof.png';
      });
      this.productListArray.push(items[x].customMetadata);
    }));    
  })
}
Promise.all(promises_array)
  .then(() => {
    console.log(JSON.stringify(this.productListArray) + " value value vlaue productlistarray");
    this.productListArray.reverse();
    this.cache.saveItem(cacheKey, this.productListArray);
})