스프링/4. 스프링 MVC-2 87

16. 레이아웃 템플릿 확장

@GetMapping("/layoutExtend") public String layoutExtend(){ return "template/layoutExtend/layoutExtendMain"; } 메인 페이지 컨텐츠 메인 페이지 포함 내용 아예 html에 replace 해놨다. 레이아웃 H1 레이아웃 컨텐츠 레이아웃 푸터 레이아웃 템플릿에서 인자로 받아 특정 부분을 대체시킨다. 이건 뭐냐면 비슷한 형태의 웹페이지가 있을 때 특정 부분들은 양식을 지키면서 다른 콘텐츠나 이런 것들만 인자로 줘서 바꾸는 거다. 기본 틀이 있고 거기에 내가 필요한 부분만 태그로 구현해 놓은다음에 그것 부분만 인자로 넘기는. 물론 레이아웃에서도 그게 어디쪽으로 들어갈 지 구현을 해 놔야지. 뭐 조각이냐, 레이아웃이냐, 레이아웃 ..

15. 템플릿 레이아웃

템플릿 조각은 조각을 불러와 그대로 썼다. 이거는 이제 아예 태그를 그대로 넣는다고 보면 된다. @GetMapping("/layout") public String layout(){ return "template/layout/layoutMain"; } 그냥 불러옴 메인 컨텐츠 얘는 head에서 "경로 :: 레이아웃(내가 구현해놓은 레이아웃에서 변경하고 싶은 부분)" 하면 이 구현해 놓은 header 조각에서 title, link를 저렇게 아래쪽 변수로 써서 추가하는 거임. 메인 컨텐츠 결과. 헤드 바뀜. 그러니까 구조가 A라는 템플릿에서 B라는 템플릿에 있는 레이아웃을 가져오고 싶으면 A가 이렇게 하면 저 fragment에서 인자로 받은 자식태그가 하나만 있어야 하는거라면 교체되고, 아니면 추가가 됨. 그..

14. 템플릿 조각

템플릿 조각은 미리 만들어 놓은 특정 태그를 불러다 쓸 수 있는거. 왜 웹페이지마다 같은 사이트라면 nav, main menu, footer 등 중복되는 부분이 있는데 그걸 미리 그 부분만 정의해둔다음에 가져다 쓰는거임. @Controller @RequestMapping("/template") public class TemplateController { @GetMapping("/fragment") public String template(){ return "/template/fragment/fragmentMain"; } } 그냥 호출 부분 포함 부분 포함 insert 부분 포함 replace 부분 포함 단순 표현식 파라미터 사용 insert는 안에다 넣는거, replace는 대체. div th:inser..

13. 타임리프 상에서 자바스크립트 사용

@GetMapping("/javascript") public String javascript(Model model){ model.addAttribute("user", new User("UserA", 10)); addUsers(model); return "basic/javascript"; } private void addUsers(Model model){ List list = new ArrayList(); list.add(new User("UserA",10)); list.add(new User("UserB",20)); list.add(new User("UserC",30)); model.addAttribute("users",list); } 모델에 user과, users 넘김. [[${user.username..

12. 타임리프 블록

@GetMapping("block") public String block(Model model){ addUsers(model); return "basic/block"; } 간단하게 private void addUsers(Model model){ List list = new ArrayList(); list.add(new User("UserA",10)); list.add(new User("UserB",20)); list.add(new User("UserC",30)); model.addAttribute("users",list); } 사용자 이름1 사용자 나이1 요약 이렇게 유일한 th 태그인데, 뭔가 그냥 따로 부모 없이 넣고 싶을 경우, 가상의 블록을 생성해서 넣었다가 뻄. 사용자 이름1 사용자 나이1 요약..

11. 타임리프 주석

@GetMapping("/comments") public String comments(Model model){ model.addAttribute("data", "Spring!"); return "basic/comments"; } 그냥 data에다 "Spring!" 담음 예시 html data 1. 표준 HTML 주석 2. 타임리프 파서 주석 html data 3. 타임리프 프로토타입 주석 주석들. html 주석, 타임리프 주석은 무슨 html 안에 java 주석 같은 느낌이네. 여러줄 주석 프로토타입 주석은 저 data가 제대로 랜더링 된 경우에만 저 태그를 보여 주는 것. data가 null이거나 그러면 아예 저 span태그 자체를 지움.

10. 타임리프 조건문

@GetMapping("/condition") public String condition(Model model){ addUsers(model); return "basic/condition"; } private void addUsers(Model model){ List list = new ArrayList(); list.add(new User("UserA",10)); list.add(new User("UserB",20)); list.add(new User("UserC",30)); model.addAttribute("users",list); } 마찬가지로 그냥 list에 유저들 넣고 model에 넣어서 템플릿으로 보냄 if, unless count username age 1 username 0 switch ..

9. 타임리프 반복문

@GetMapping("/each") public String each(Model model){ addUsers(model); return "basic/each"; } private void addUsers(Model model){ List list = new ArrayList(); list.add(new User("UserA",10)); list.add(new User("UserB",20)); list.add(new User("UserC",30)); model.addAttribute("users",list); } 리스트에 User 넣은다음에 그걸 모델에다 넣어줌. 기본 테이블 username age username 0 반복 상태 유지 count username age etc username userna..

8. 타임리프 속성

@GetMapping("/attribute") public String attribute(){ return "basic/attribute"; }​ 그냥 가기만 함. 속성 설정 속성 추가 - th:attrappend = - th:attrprepend = - th:classappend = checked 처리 - checked o - checked x - checked=false 타임리프의 속성, 그러니까 th:해서 쓰는 건 기존 태그에 속성이 없었으면 추가해주고 있었으면 덮어씀. attrappend attrprepend 이거는 속성 앞이나 뒤 쪽에 추가시켜주는거. 이렇게 하면 th:attrappend="class=' large' " input의 class 속성에 large 추가. 저렇게 띄어쓰기까지 해야 함..