뷰 템플릿에 컨버터 적용하기

이번에는 뷰 템플릿에 컨버터를 적용하는 방법을 알아보겠습니다.
타임리프는 렌더링 시에 컨버터를 적용해서 렌더링 하는 방법을 편리하게 지원합니다.
이전까지는 문자를 객체로 변환했다면, 이번에는 그 반대로 객체를 문자로 변환하는 작업을 확인할 수 있습니다.

 

아래와 같이 뷰를 반환하는 컨트롤러를 만듭니다.

model에 정수 number(10000)와 ipPort객체를 담았습니다.

 

converter-view.html은 다음과 같습니다.

밑줄을 보시면 어떤곳은 ${ }로 대괄호가 한짝만 쓰였고, 어떤 부분은 ${{ }}로 대괄호가 두짝이 쓰였습니다.

결론부터 말하자면 ${{ }}처럼 대괄호 두짝을 쓰면 Converter가 적용됩니다.

 

이제 /convert-view에 요청을 해보겠습니다.

converter-view.html

특히 네번째를 보면 컨버터가 적용되어 IpPort객체가 문자열로 잘 출력된것을 보실 수 있습니다.

log로도 확인할 수 있습니다.

 

1. ${{number}} : 뷰 템플릿은 데이터를 문자로 출력합니다. 따라서 컨버터를 적용하게 되면 Integer 타입인 10000 을 String 타입으로 변환하는 컨버터인 IntegerToStringConverter 를 실행하게 됩니다. 이 부분은 컨버터를 실행하지 않아도 타임리프가 숫자를 문자로 자동으로 변환히기 때문에 컨버터를 적용할 때와 하지 않을 때가 같습니다.
2. ${{ipPort}} : 뷰 템플릿은 데이터를 문자로 출력합니다. 따라서 컨버터를 적용하게 되면 IpPort 타입을 String 타입으로 변환해야 하므로 IpPortToStringConverter 가 적용됩니다. 그 결과 127.0.0.1:8080 가 출력된 것입니다.

 

 

 

 

폼에 적용하기

이번에는 컨버터를 폼에 적용해보겠습니다.

 

IpPort객체를 넣은 form객체를 model에 add합니다. 

 

converter-form.html은 아래와 같습니다.

converter-form.html

위에서 한 줄은 field를, 아래 줄은 value를 사용합니다. field는 컨버터가 자동 적용됩니다.

브라우저 결과

IpPortToStringConverter 작동

 

 

이제 post에 매핑된 컨트롤러를 보면 

modelAttribute가 Form 객체를 만들기 위해 StringToIpPortConverter를 적용하고, 

타임리프는 model에 담긴 ipPort객체를 출력하기 위해 IpPortToStringConverter를 작동시킵니다.