无法获取要在Ember.js中呈现的模板部分

Question

我在让Ember.js拾取并渲染车把模板文件时遇到一些问题。 我在浏览器的调试控制台中收到以下错误：

错误：<（Welcome.LoginView的子类）：ember166>-无法找到模板“ login_view”。

我的app.js文件中的emberjs代码中包含以下代码：

Welcome = Ember.Application.create();

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

我的index.html文件中还包含以下代码段：

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

最后，相对于app.js文件，我有文件templates / login_view.handlebars，其中包含要呈现的模板内容：

<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在Ember.TEMPLATES数组中查找模板-它不会自动查找位于templates/并以.handlebars结尾的templates/ 。 如果没有为您编译模板的构建步骤，则您必须自己执行此操作。

这听起来可能很复杂，但如下所示：

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

您必须先确保此模板定义已出现， 然后才能使用它。

---

另一种解决方案是将模板内联到index.html ，并向script标签添加data-template-name="login_view"属性：

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

但是，如果您的项目有许多模板，那么我建议您采用一种可以为您做第一个选择的构建工具。

---

相关问题： 是否可以通过Ajax加载Handlebars模板？