[AG Grid] t.map is not a function 에러 해결 방법

 

이번 글은 AG Grid를 적용하면서, 프론트 단에서 백엔드 단으로 API 송신을 하여 데이터를 가져올 때 프론트 단에서 발생한 t.map is not a function 에러 해결 방법에 대해 기록한다.

 

아래와 같이, 프론트 단에서 GET 방식으로 해당 URL에 맞게 요청을 보냈다.

var httpRequest = new XMLHttpRequest();
httpRequest.open('GET', '/common/search/json/data2.json');

 

해당 URL에 맞게 데이터를 받아왔는데, 아래와 같이 t.map is not a function 에러가 발생했다.

 

해당 에러가 발생한 부분은 아래와 같다.

gridOptions.api.setRowData(httpResult);

 

위의 에러는 httpResult에 대한 형식이 맞지 않아 에러가 발생한 문제였다.

데이터가 어떻게 들어왔는지 아래와 같이 디버깅을 해보니, 여러 개의 데이터가 data라는 Key로 더 감싸져 있어서 에러가 발생했다.

 

즉, AG Grid는 JSONArray 형식으로만 가져오면 된다.

 

 

그래서, 아래와 같이 httpResult를 httpResult.data로 data에 있는 값을 꺼내와서 하니 문제가 해결됐다.