2

我在让 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 时，我在页面上看不到上面的表单。

谁能阐明我做错了什么？

4

1 回答 1

4

根据您的问题，我假设您没有使用一些为您预编译车把模板的工具。Ember 在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>

但是，如果您的项目有许多模板，那么我建议您采用一个构建工具来为您提供第一个选项。

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

于 2012-04-17T02:59:26.103 回答