스프링부트 타임리프에서 자바스크립트를 사용해본 사람이라면 이 자바스크립트에 값을 전달했을 때 오류가 나본 적인 한 번 쯤은 있을 것이다.
우선 문제는 타임리프가 자바스크립트 코드를 처리하는데 문제가 있는 거라고 한다. 표현식을 잘못 해석했다는 것.
어제 다른 학생의 컴퓨터에서도 문제를 해결해 줬었는데, 그때와 다른 처음보는 방법을 찾게 되어 포스팅을 하게 되었다.
[문제]
우선 나는 아래와 같은 형태로 값을 전달하려고 했는데,

버튼을 누르면 아래와 같이 에러가 났다.

페이지 소스를 확인해보니 문자가 그대로 찍히고 있었다.

[해결]
이때 사용한 방법이 바로 파이프 ( |) 문자이다.
파이프 문자는 타임리프에서 문자를 조합할 때도 사용하는 문자로, 문자열 내의 표현식을 안전하게 처리하도록 돕는 역할을 하는 것이다.

역슬레시를 넣고 말고 할 것도 없이 이 파이프 문자 하나면 해결.

페이지 소스 확인해보니 값이 잘 읽히는 것을 볼 수 있다.