如何在TypeScript中获取Java Map的值

huangapple go评论139阅读模式
英文:

How to get value of Java Map in Typescript

问题

我正在使用Spring Boot作为后端,Angular 7作为前端的应用程序。我必须将地图作为响应发送。例如,假设:

Map<String, Object> additionalResponse = new HashMap<>() {
    {
        put("key1", "value2");
        put("key2", "value2");
    }
};

我通过响应DTO将这个地图传递给Angular,如下所示:

public class SearchResponseDto implements Serializable {
    private Map<String, Object> additionalResponse;
}

现在在Angular中,我这样使用它:

export class SearchResponseDto {
    additionalResponse: Map<string, any>;
}

我可以从additionalResponse中获取值,但是当我尝试在additionalResponse上使用get函数时,它会给我返回undefined值。我应该怎么做才能在Angular中将additionalResponse用作地图?

编辑:
我在Angular中使用后端响应:

fetchData() {
    fetchResponse().
       subscribe(
          response => {
             this.response = response;
          },
          errorResponse => {
          },
       );
}

fetchResponse(): Observable<SearchResponseDto> {
    return this.http.post<SearchResponseDto>(
      <api-endpoints>
    );
}

然后,尝试使用this.response.additionalResponse.get('key1'),但我得到的值是undefined,但我可以从this.response.additionalResponse获取值。

在Postman中,我得到的响应是:

{
  "additionalResponse": {
    "key1": "value2",
    "key2": "value2"
  }
}

希望这对你有所帮助。

英文:

I am using Spring boot as backend and Angular 7 as frontend in an application. I have to send map as response. For instance, say:

  Map&lt;String, Object&gt; additionalResponse = new HashMap&lt;&gt;() {
        {
            put(&quot;key1&quot;,&quot;value2&quot;);
            put(&quot;key2&quot;,&quot;value2&quot;);
           
        }
    };

I pass this map via response DTO to angular which is:

public class SearchResponseDto implements Serializable {
private Map&lt;String, Object&gt; additionalResponse;
}

Now on angular, I am using it as:

 export class SearchResponseDto {
     additionalResponse: Map&lt;string, any&gt;;
   }

I can get value from additionalResponse but when I try to use get function in additionalResponse, it is giving me undefined value. What should I do to use additionalResponse as Map on angular?

Edit:
I am using the backend response in Angular as:

      fetchData() {
        fetchResponse().
           .subscribe(
              response =&gt; {
     
                this.response = response;
          
            },
           errorResponse =&gt; {
       
          },
       );
      }



 fetchResponse(): Observable&lt;SearchResponseDto&gt; {
            return this.http.post&lt;SearchResponseDto&gt;(
              &lt;api-endpoints&gt;
            );
          }

And, trying to use as this.response.additionalResponse.get('key1') and I am getting value as undefined but I am getting value from this.response.additionalResponse

On Postman, I am getting response as:

{
  &quot;additionalResponse&quot;: {
    &quot;key1&quot;: &quot;value2&quot;,
    &quot;key2&quot;: &quot;value2&quot;
  }
}

答案1

得分: 1

以下是您要翻译的内容:

const response = {
  "additionalResponse": {
    "key1": "value2",
    "key2": "value2"
  }
}

const { additionalResponse } = response;

const map = Object.entries(additionalResponse).map(([key, value]) => {
  console.log(key, value)
})

或者您可以将其转换为Map:

const map = new Map();
const response = {
  "additionalResponse": {
    "key1": "value2",
    "key2": "value2"
  }
}

const { additionalResponse } = response;

Object.entries(additionalResponse).forEach(([key, value]) => {
  console.log(key, value)
  map.set(key, value)
})

[已更新]

fetchData() {
  fetchResponse().
    subscribe(
      response => {

        const { additionalResponse } = response;

        Object.entries(additionalResponse).forEach(([key, value]) => {
          console.log(key, value)
          map.set(key, value)
        })

      },
      errorResponse => {

      },
    );
}
英文:
const response= {
  &quot;additionalResponse&quot;: {
    &quot;key1&quot;: &quot;value2&quot;,
    &quot;key2&quot;: &quot;value2&quot;
  }
}

const { additionalResponse } = response;

const map = Object.entries(additionalResponse).map(([key, value])=&gt;{
  console.log(key, value)
})

OR you can convert it to the Map:

const map = new Map();
const response= {
  &quot;additionalResponse&quot;: {
    &quot;key1&quot;: &quot;value2&quot;,
    &quot;key2&quot;: &quot;value2&quot;
  }
}

const { additionalResponse } = response;

Object.entries(additionalResponse).forEach(([key, value])=&gt;{
  console.log(key, value)
  map.set(key, value)
})

[UPDATED]

     fetchData() {
        fetchResponse().
           .subscribe(
              response =&gt; {
     
                const { additionalResponse } = response;

               Object.entries(additionalResponse).forEach(([key, value])=&gt;{
               console.log(key, value)
               map.set(key, value)
               })
          
            },
           errorResponse =&gt; {
       
          },
       );
      }

答案2

得分: 0

遍历 response.additionalResponse 对象响应,并创建新的映射并提取键,如下所示:

var mapResp = new Map();
for (key in response.additionalResponse) {
    mapResp.set(key, response.additionalResponse[key]);
}
mapResp.get('key1'); // 这将给您 value2
英文:

Iterate throught the response.additionalResponse object response and create new map and extract the key like below:

var mapResp = new Map();
for(key in response.additionalResponse){
    mapResp.set(key, response.additionalResponse[key]);
}
mapResp.get(&#39;key1&#39;); // this will give you value2

答案3

得分: 0

我已找到解决方案,我将 Map<string, any> 替换为 any,并可以从 this.response.additionalResponse.key1 获取值,不知道这是否是一个好的做法。如上评论所述,这可能是由于 JSON 类型,但我真的找不到正确声明它的方法。

英文:

I got the solution, I replaced Map<string, any> with just any and can get value from this.response.additionalResponse.key1, don't know if it's a good practice though. As said in the above comment, it might be due to JSON type but I really not finding a way to declare it accordingly.

huangapple
  • 本文由 发表于 2020年8月7日 22:29:32
  • 转载请务必保留本文链接:https://go.coder-hub.com/63303842.html
匿名

发表评论

匿名网友

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen:

确定