Ember.js에서 렌더링 할 템플릿 부분을 가져올 수 없습니다.

Question

Ember.js가 핸들 모음 템플릿 파일을 선택하여 렌더링하는 데 문제가 있습니다. 내 브라우저의 디버그 콘솔에서 다음과 같은 오류가 발생합니다 :

Error: <(subclass of Welcome.LoginView):ember166> - Unable to find template "login_view".

내 app.js 파일에 emberjs 코드에 다음 코드가 : 나는 또한 내 인덱스에서 다음 코드를

Welcome = Ember.Application.create(); 

Welcome.LoginView = Ember.View.extend({ 
    templateName: 'login_view' 
}); 

합니다. HTML 파일 : 렌더링하는 템플릿 내용이 포함 I 파일 템플릿/login_view.handlebars이있는 app.js 파일을 기준으로 마지막으로

<script type="text/x-handlebars"> 
    {{view Welcome.LoginView}} 
</script> 

:

<form class="form-inline"> 
    <fieldset> 
    <input type="text" name="email" placeholder="email address"> 
    <input type="password" name="password" placeholder="password"> 
    <button class="btn btn-primary" type="submit">Sign In</button> 
    <!-- ... --> 
    </fieldset> 
</form> 

이 오류는 핸들 바 템플릿을 찾을 수 없다는 것을 나타냅니다. 생성 된 HTML을 볼 때 위의 양식이 페이지에 표시되지 않습니다.

내가 뭘 잘못하고 있는지 알 수있는 사람이 있습니까?

Answer 1

나는 당신이 당신을 위해 핸들 바 템플릿을 사전 컴파일하는 도구를 사용하지 않는다고 가정합니다. 엠버는 Ember.TEMPLATES 배열의 템플릿을 찾습니다. templates/에 있고 .handlebars으로 끝나는 템플릿은 자동으로 찾지 않습니다. 템플릿을 컴파일하는 빌드 단계가 없으면 직접해야합니다.

이 복잡하게 들릴 수는 있지만, 다음과 같은만큼 쉽게 :

Ember.TEMPLATES["login_view"] = Ember.Handlebars.compile('TEMPLATE CODE'); 

하는 당신은 당신이 그것을 사용하려는 전에이 템플릿 정의가 발생하는지 확인해야합니다.

---

또 다른 해결책이 index.html에 템플릿을 인라인하고 스크립트 태그에 data-template-name="login_view" 속성을 추가하는 것입니다 : 프로젝트가 다음 다양한 템플릿이있는 경우

<script type="text/x-handlebars" data-template-name="login_view"> 
    <form class="form-inline"> 
    <!-- ... --> 
    </form> 
</script> 

하지만를, 난 당신이 채택 제안 첫 번째 옵션을 제공하는 빌드 도구.

---

관련 질문 : Is it possible to load a Handlebars template via Ajax?