异步/等待无法正常工作，映射函数离子 4，打字稿

Question

正如我在标题中提到的，我有一个包含map函数的方法。

我正在使用离子4。

 async searchedData(data){
      if(this.searchedItems.length == 0){
        this.clearfilter()
      }
      if(data == "cleardata"){
        this.searchedItems = [];
      }
       else{
       //after searching
       console.log(data)     
      await data.map(async x=>{
        x["file_type"] =x.resource_name.substring(x.resource_name.lastIndexOf('.')+1)
        user.forEach(element => {
          if(x["user_id"] == element.id){
                return x["userobj"] = element;
              }
          });
        x["socialIcons"] = this.socialIcons;
        x["user_reaction"] = await this.getCreativeReactions(x)
        console.log(x["user_reaction"]) 
        return x;
      }),
        this.searchedItems = this.searchedItems.concat(data);
      }
    }

问题出在这条线上：

x["user_reaction"] = await this.getCreativeReactions(x) 
 console.log(x["user_reaction"]) 

getCreativeReactions代码如下所示

getCreativeReactions(x:any){
     this.creativeServices.getCreativeReactions1(x["id"],x["userobj"]["id"]).pipe(map(res1=>res1.json())).subscribe(res1=>{
          x["user_reaction"] = res1;
          x["user_reaction"].forEach(element=>{
            switch(element["latestReaction"]){
             case 'like' :{
              x["socialIcons"][0]["color"] = "danger" 
              x["socialIcons"][0]["operation"] = "cancellike"
              break;
             } 
             case "unlike":{
              x["socialIcons"][1]["color"] = "danger" 
              x["socialIcons"][1]["operation"] = "cancelunlike"
              break;  
             }
             case "cancellike":{
             x["socialIcons"][0]["color"] = "default" 
             x["socialIcons"][0]["operation"] = "like"
              break;
             }
             case "cancelunlike":{
             x["socialIcons"][1]["color"] = "default" 
             x["socialIcons"][1]["operation"] = "unlike"
              break;
             }
            }
          })
          return x["user_reaction"]
        })
      }

我有一个方法getCreative反应，它返回一个对象数组。但问题是，虽然 await 的前缀如上所示 console.log(( 首先执行，然后调用方法。因此，我得到 x["user_reaction"] 未定义。

我是否使用地图函数的异步/等待语法出错？

Answer 1

让你的getCreativeReactions方法返回一个有决心的承诺

喜欢这个

getCreativeReactions(x: any) {
    return new Promise((resolve, reject) => {
        this.creativeServices.getCreativeReactions1(x["id"], x["userobj"]["id"]).pipe(map(res1 => res1.json())).subscribe(res1 => {
            x["user_reaction"] = res1;
            x["user_reaction"].forEach(element => {
                switch (element["latestReaction"]) {
                    case 'like': {
                        x["socialIcons"][0]["color"] = "danger"
                        x["socialIcons"][0]["operation"] = "cancellike"
                        break;
                    }
                    case "unlike": {
                        x["socialIcons"][1]["color"] = "danger"
                        x["socialIcons"][1]["operation"] = "cancelunlike"
                        break;
                    }
                    case "cancellike": {
                        x["socialIcons"][0]["color"] = "default"
                        x["socialIcons"][0]["operation"] = "like"
                        break;
                    }
                    case "cancelunlike": {
                        x["socialIcons"][1]["color"] = "default"
                        x["socialIcons"][1]["operation"] = "unlike"
                        break;
                    }
                }
            })
            resolve(x["user_reaction"]); // here we return the awaited value
        })
    });
}