2013-01-20 1 views
0

샘플 app에 handlebar.js를 구현하고있었습니다. handlebar.js 설명서에 설명 된대로 예제로 시도했습니다. 그러나 값은 스크립트 내부의 dom에로드되지만 브라우저에서는 볼 수 없습니다. HTMLhandlebar.js를 사용할 때 브라우저에 데이터가 표시되지 않았습니다.

<body> 
<h1>Handlebar</h1> 
<script id="entry-template" type="text/x-handlebars-template"> 
<div class="entry"> 
    <h1>{{title}}</h1> 
    <div class="body"> 
    {{body}} 
    </div> 
</div> 
</script> 
<script src="js/jquery-1.8.3.min.js"></script> 
<script src="js/handlebars.js"></script> 
<script src="js/app.js"></script> 
</body> 

는 app.js 브라우저가 값 제목을 찾을 수 불을 지르고 통해 디버깅하는 동안 내가 빈 화면을 받고 있지만,하고로드되는

var source = $("#entry-template").html(); 
var template = Handlebars.compile(source); 
var context = {title: "My New Post", body: "This is my first post!"} 
var html = template(context); 
$("#entry-template").html(template(context)); 

및 본문

답변

6

<script> el 장담 :

$("#entry-template").html(template(context)); 

#entry-template<script>입니다 :

<script id="entry-template" type="text/x-handlebars-template"> 

브라우저가 type<script>의 내용을 표시하지 않습니다. 다음

<h1>Handlebar</h1> 
<div id="html-goes-here"></div> 

과 :

$("#html-goes-here").html(template(context)); 
당신이 표시됩니다 <div> 같은으로 템플릿 작성을 데려 가고 싶다는