반응형
동적생성
-
데이터 바인딩을 도와주는 handlebars.js 사용법Knowledge/javascript 2019. 8. 26. 23:50
ajax로 가져온 데이터를 동적으로 추가해야 하는 상황은 상당히 자주 발생한다. Handlebars.js는 이런 상황을 좀 더 쉽게 처리할 수 있도록 도와주는 라이브러리.. 라는데 사실 익숙하지 않으면 되려 더 어렵다. 필자도 이번에 처음 써보면서 많이 헤맸는데 헤매면서 알게된, 진작 알았으면 좋았을 만한 것들을 정리해두려 한다. - 기본 사용법 기본사용법은 다음과 같다. 1. 템플레이팅할 html을 세팅한다. 이때 데이터 바인딩 시킬 부분은 {{바인딩시킬 데이터의 프로퍼티명}} 의 형태로 적는다. 2. htmlTemplate을 가져온후 Handlebars로 compile 한다. 3. 컴파일한 템플릿에 데이터를 집어넣는다. 이 때 리턴값은 html로 나온다. 4. 리턴받은 html을 target에 inn..