JSP에서 템플릿 리터럴에 백틱을 사용하면 에러가 나는 이유

✨시작하며

JSP에서 템플릿 리터럴에 백틱을 사용하면 데이터가 제외되고 출력된다.
어떻게 하면 템플릿 리터럴을 출력하도록 할 수 있을까?

 

 

 

🧩코드 조각

바로 ${count} 앞에 역슬래시()를 입력하면 된다!

아래의 코드처럼 리터럴 앞에 역슬래시를 붙이게 된다면, 템플릿 리터럴 값이 정상적으로 출력되는 것을 확인할 수 있다.

간단한 예를 들어보자.
HTML과 같은 경우에서는 현재 ${count}번 입니다.라고 입력해도 count값이 잘 출력되겠지만, JSP에서는 현재 번 입니다.처럼 출력된다.

JSP에서는 현재 \${count}번 입니다.처럼 입력해야 현재 ${count}번 입니다.처럼 출력된다.

// 클릭하면 항목 추가
var count = 1;

function fn_dataAdd(e) {
    count++;

    var newElement = `
        <li class="cell-row row" id="Coord\${count}">
                    <div class="cell col-5">
                        <div class="cell-title">
                            <label for="LatDegree\${count}" class="" title="위도">위도</label>
                        </div>
                        <div class="cell-content">
                            <ul class="label-list">
                                <li class="label-item">
                                    <label class="code" for="LatDegree\${count}">
                                        <input name="LatDegree\${count}" id="LatDegree\${count}" class="b-name form-intxt" type="text" alt="위도_도" onKeyup="this.value=this.value.replace(/[^0-9.]/g, '');" maxlength="14">
                                    </label>
                                </li>
                            </ul>
                        </div>
                    </div>
        </li>`;

    $(e).closest('.form-wrap').find('ul.form-box').append(newElement);
}

 

 

 

📜참고