Ember.js ember hbs模板作为单独的文件
我想运行第一页提供的ember.js（最终版本1.0.0）示例 他们用扩展名Ember.js ember hbs模板作为单独的文件,ember.js,Ember.js,我想运行第一页提供的ember.js（最终版本1.0.0）示例 他们用扩展名.hbs将每个把手模板划分在单独的文件中 所以我只是复制了所有代码并创建了同名文件。当我运行它们时，什么都不会发生。我正在尝试一个路由示例 我的index.html： <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>Ember Starter Kit</title>
.hbsindex.html<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Ember Starter Kit</title>
<link rel="stylesheet" href="css/normalize.css">
<link rel="stylesheet" href="css/style.css">
<link rel="stylesheet" href="css/bootstrap.css">
<link rel="stylesheet" href="css/bootstrap-theme.css">
</head>
<body>
<script src="js/libs/jquery-1.9.1.js"></script>
<script src="js/libs/handlebars-1.0.0.js"></script>
<script src="js/libs/ember-1.0.0.js"></script>
<script src="js/libs/bootstrap.js"></script>
<script src="js/app.js"></script>
</body>
</html>
余烬起动器套件
我的模板位于根目录中，我将它们复制到
/templatesEmber.TEMPLATES小名称键存储模板内容。因此，我们自己可以在编译模板后推送它们
例如：如果您有一个名为“post”的模板，请通过AJAX请求加载post.hbs
文件，然后设置
// "data" is html content returned from Ajax request
Ember.TEMPLATES['post'] = Ember.Handlebars.compile(data)
因此，现在您可以通过以下方式直接访问模板：
{{partial 'post'}}
在把手或中，为任何视图类设置为templateName
App.OtherView = Ember.View.extend({
templateName: 'post'
});
因此，您可能必须通过AJAX请求加载所有HBS文件，并在加载应用程序之前编译它们。对于应用程序来说，这是一个很大的开销
为了简化这个过程，我们可以预编译所有模板并将它们保存为JS（这实际上会将它们推送到Ember.templates对象中），然后只加载那个JS。这可以通过使用插件来实现，插件也可以作为grunt作业使用
2）第二种方法是创建视图对象，并在AJAX请求后将编译后的代码设置为每个视图的模板。requirejs
的文本插件可以帮助您做到这一点
现在，Ember的人建议除非需要，否则不要创建视图对象，我建议您遵循第一种方法。预编译是最好的选择，它可以在每次创建模板时减少大量工作
更新：有一些项目构建工具负责编译把手模板。这些都是你可以看一眼的 您要么需要使用构建过程来编译模板并连接应用程序逻辑，要么需要使用某种模块解析实现
如果您在后端使用rails，请查看
如果没有，请检查并使用Grunt构建模板。它创建了一个template.js文件，我在Ember之后加载它。
这是我自己在coffescript上的Grunt配置：
module.exports = (grunt) ->
tmpl_dir = 'app_src/templates'
grunt.initConfig
tmpl_dir: tmpl_dir
ember_handlebars:
options:
processName: (path) ->
re = new RegExp("^#{tmpl_dir}\/(.*)\.hbs$", 'i')
r = path.match(re)
path = r[1]
path = path.replace /\_/g, '-'
console.log '>', path
path
files:
src: '<%= tmpl_dir %>/**/*.hbs'
dest: 'public/js/templates.js'
grunt.loadNpmTasks('grunt-ember-handlebars')
module.exports=（咕噜）->
tmpl_dir='app_src/templates'
grunt.initConfig
tmpl_目录：tmpl_目录
余烬_把手：
选项：
processName：（路径）->
re=new RegExp（“^{tmpl\u dir}\/（.*）\.hbs$”，'i'）
r=路径匹配（re）
路径=r[1]
path=path.replace/\\ ug，'-'
console.log'>'，路径
路径
文件夹：
src:“/***/*.hbs”
dest:'public/js/templates.js'
grunt.loadNpmTasks（“grunt-ember-handlebar”）
您是如何加载这些hbs文件的？？？我没有加载它们，以为它们是通过框架加载的。没有。请检查我的解决方案…感谢您的回复，我将尝试使用这些工具！我见过grunt，它可以最小化js，我认为最好有一个工具，在生产之前浓缩所有模板并缩小它们，或者在请求模板时制作特殊逻辑，然后加载它并将其放入缓存，然后从缓存加载。谢谢，你们知道用于延迟加载模板的工具吗？如果project会有很多模板，并且在启动时加载这些模板对客户端来说成本会很高，这会有所帮助。是的，有一种方法可以加载模板…我有一个链接，其中详细介绍了lazyload JS文件，您可以将其用于模板…@CodeJack我已经遵循了预编译模板并加载JS文件，但我发现一些与余烬模板兼容的问题，