2014-04-06 2 views
0

저는 Ember에게 완전히 익숙하며 실제로 코드를 약간 구성하려고합니다. 이렇게하려면 외부 파일에서 내 Handlebars 템플릿을로드하려고합니다. 모든 것을 컴파일 할 때까지 잘 작동합니다.Ember.Handlebars.compile이 실패했습니다.

이 충돌
var url = 'js/app/templates/index.hbs', templateName = url.replace('.hbs', ''), 
    datas = {name:'John'}; 

var load_tpl_success = function(hbs_tpl) { 
    Em.TEMPLATES[templateName] = Em.Handlebars.compile(hbs_tpl)(datas); 
    Em.$('body').append(Em.TEMPLATES[templateName]); 
}; 

Em.$.ajax({ url: url, async: false, success: load_tpl_success}); 

나에게 테 오류 제공 : catch되지 않은 형식 오류 :

Handlebars.compile(hbs_tpl)(datas) 

모두 내가 때까지 잘 작동 : 내가 사용하는 경우, 정의되지 않은

방법 '푸시'를 호출 할 수는 없지만를 Ember가 만든 {{input}} 및 다른 것들을 사용하여 시작하십시오. 그래서 기본적으로 Handlebars는 작동하지만 Ember는 작동하지 않는 것처럼 보입니다 ... Ember ahah가 필요합니다.

Ember의 최신 버전을 자체 Handlebars (구 버전)와 함께 사용하고 있습니다.

누구나 아이디어가 있습니까?

답변

1

Em.Handlebars.compile은 렌더링에 사용할 수있는 템플릿 함수를 반환합니다. 템플릿을 작성한 다음 즉시 함수를 호출하여 템플릿을 컴파일합니다. 그 라인을 템플릿을 생성하지 않는

Em.TEMPLATES[templateName] = Em.Handlebars.compile(hbs_tpl)(datas); 

, 그것을 렌더링 한 다음을 만드는 것. 따라서 Ember.js는 템플릿을 기대하지만 렌더링 된 템플릿 (문자열)을 제공합니다. Ember.js가 직접 템플릿 메소드를 호출해서는 안됩니다. 따라서이 줄은 아니오입니다.

Em.$('body').append(Em.TEMPLATES[templateName]); 

템플릿으로 수행해야하는 유일한 작업은 템플릿을 만들어 Ember.js의 위치를 ​​알려주는 것입니다. script 태그를 통해 HTML에 포함하거나 Em.TEMPLATES 해시에 태그를 추가하여 태그를 추가 할 수 있습니다. 그러나 후자를 수행하는 경우, 그 템플릿을 사용하기 전에 해당 템플릿을 사용하여 경로로 이동하지 않도록하십시오.

TL : DR : Ember.js가 너무 복잡하여 템플릿을 미리 컴파일하거나 지연로드하는 것에 대해 걱정할 필요가 없습니다. 당신이 그들의 일에 좀더 익숙 할 때까지 가이드에서 좋아하는 꼬리표 script에서 그 (것)들을 끼워 넣으십시오.

EDIT : 일반적으로 적용되지만 특히 Ember.js : 으로 작업하지 않는 경우 동기 AJAX 요청을 실행하십시오. 그렇게하고 싶지 않은 경우는 거의 없으며, 그 중 하나가 아닙니다.

관련 문제