[AngularJS] 9. AngularJS로 게시판 만들기(2)

BOARD DETAIL

 

글 상세보기 기능을 추가하였다.

기능을 추가하면서 막히는 부분이 있었지만 그래도 기본적인 기능이라 잘 풀어 나갔다.

bootstrap을 사용해서 UI구성을 하는게 제일 어려운 것 같다..

 

board_list.jsp

리스트 페이지에서 글을 선택하면 상세 페이지로 넘어가는 식이다.

16LINE에 게시판 리스트의 글 제목을 누르면 state가 detail로 바뀌도록 수정했다.

state를 바꿀때 파라미터도 같이 넘겨줬다.

 

boardConfig.js

12LINE처럼":/param" 형식으로 지정해주면 넘겨받은 파라미터를 url에 표시할 수 있다.

 

boardCtrl.js

상세 보기 페이지에서 사용되는 컨트롤러이다.

stateProvider에서 state가 바뀔때 파라미터를 넘겼었는데, 이 파라미터를 가져오는 모듈은 $stateParams이다.

7LINE CONSOLE.LOG

8LINE에 보면 $scope.board 변수가 초기화 되어 있다.

board는 서버에서 응답받은 특정 게시글 데이터를 담는 변수이다.

 

10~12LINE을 보면 boardSvcFactory에 정의되어 있는 getBoardDetail 함수를

idx파라미터와 함께 호출하여 response값을 board 변수에 담는다.

 

boardSvcFactory.js

서비스 함수들을 정의한 js파일이다.

getBoardDetail을 호출하면 http객체를 return한다.

 

boardController.java

spring의 컨트롤러 부분이다.

35~36LINE은 state가 detail로 변경됐을때 templateUrl 속성으로 인해 호출되어 뷰를 반환하는 메소드 부분이고

 

40LINE부터는 사용자가 선택한 게시글의 정보를 가져오는 부분이다.

@RequestBody를 사용하여 Map<String, Object> 형식으로 파라미터를 받으려고 열심히 시간낭비를 했었다..

@RequestBody는 body태그내의 파라미터들을 검사한다고 한다..

http요청할 때 넘겨줄 파라미터 속성은 @RequestBody가 인식을 못한다.

---

RESULT