Mustache custom tag

오늘은 설명없이 간단한 코드만 명시할 예정이다. Mustache template engine 관련된 간단한 예제 코드이다.

Mustache template engine 에 대한 간단한 설명은 아래 글을 통해 확인 가능하다. (https://lkhlkh23.tistory.com/64)

첫번째 함수는 일반적인 Mustache template engine 에 대한 예제이다. 별로 설명할 필요가 없을거 같다.

두번째 함수는 사용자가 정의한 태그를 이용해서 렌더링하는 코드의 예제이다.

굳이, 왜 필요할까? 라고 생각할 수 있을 것이다. 필요하다. 정말 필요하다. 왜냐하면, Mustche template engine 은 서버와 프론트에서 동시에 사용할 수 없다.

	
 $(document).ready(function() {
	renderRedText();
	renderBlueTextByCustom();
});
function renderRedText(){
	var template = '
{{{contents}}}
';
	var data = {
		'contents' : ' red text '
	}
	var compiled = Mustache.render(template, data);
	console.log(compiled);
	$('#area').append(compiled);
}

function renderBlueTextByCustom(){
	var customTags = [ '[[', ']]' ];
	var template = '
[[{ contents }]]
';
	var data = {
		'contents' : ' blue text '
	}
	var compiled = Mustache.render(template, data, {}, customTags);
	console.log(compiled);
	$('#area').append(compiled);
}