我是 Ember 的新手，正在尝试遵循 ToDo 应用程序教程。但是，我很难在我的 index.html 文件中生成 Handlebars 脚本。这里是索引文件看起来是什么 pre-handlebars 脚本
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Ember.js • TodoMVC</title>
<link rel="stylesheet" href="style.css">
</head>
<body>
<section>
<section id="todoapp">
<header id="header">
<h1>todos</h1>
<input type="text" id="new-todo" placeholder="What needs to be done?" />
</header>
<section id="main">
<ul id="todo-list">
<li class="completed">
<input type="checkbox" class="toggle">
<label>Learn Ember.js</label><button class="destroy"></button>
</li>
<li>
<input type="checkbox" class="toggle">
<label>...</label><button class="destroy"></button>
</li>
<li>
<input type="checkbox" class="toggle">
<label>Profit!</label><button class="destroy"></button>
</li>
</ul>
<input type="checkbox" id="toggle-all">
</section>
<footer id="footer">
<span id="todo-count">
<strong>2</strong> todos left
</span>
<ul id="filters">
<li>
<a href="all" class="selected">All</a>
</li>
<li>
<a href="active">Active</a>
</li>
<li>
<a href="completed">Completed</a>
</li>
</ul>
<button id="clear-completed">
Clear completed (1)
</button>
</footer>
</section>
<footer id="info">
<p>Double-click to edit a todo</p>
</footer>
<script src="js/libs/jquery-1.10.2.min.js"></script>
<script src="js/libs/handlebars-1.1.2.js"></script>
<script src="js/libs/ember-1.4.0.js"></script>
<script src="js/libs/ember-data.js"></script>
<script src="js/application.js"></script>
<script src="js/router.js"></script>
</body>
</html>
但是，当我将 handlebars 脚本标记包装在 body 元素中时，其他 HTML 元素无法正确呈现。该代码未在我的浏览器中运行，我怀疑该脚本在某处缺少结束元素。我不确定在哪里。有没有人有任何指示。非常感谢并提前感谢您。
<script type="text/x-handlebars" data-template-name="todos">
<section>
<section id="todoapp">
<header id="header">
<h1>todos</h1>
<input type="text" id="new-todo" placeholder="What needs to be done?" />
</header>
<section id="main">
<ul id="todo-list">
<li class="completed">
<input type="checkbox" class="toggle">
<label>Learn Ember.js</label><button class="destroy"></button>
</li>
<li>
<input type="checkbox" class="toggle">
<label>...</label><button class="destroy"></button>
</li>
<li>
<input type="checkbox" class="toggle">
<label>Profit!</label><button class="destroy"></button>
</li>
</ul>
<input type="checkbox" id="toggle-all">
</section>
<footer id="footer">
<span id="todo-count">
<strong>2</strong> todos left
</span>
<ul id="filters">
<li>
<a href="all" class="selected">All</a>
</li>
<li>
<a href="active">Active</a>
</li>
<li>
<a href="completed">Completed</a>
</li>
</ul>
<button id="clear-completed">
Clear completed (1)
</button>
</footer>
</section>
<footer id="info">
<p>Double-click to edit a todo</p>
</footer>
</script>
最佳答案
我不完全确定问题出在哪里，但我会检查您的所有 js 文件是否都已正确加载。我实际上尝试了来自 here 的 ToDo 演示它使用了 JS Bin，但我没有看到它在工作。然而，在获取该代码并将其放入 jsfiddle 之后，源代码被加载到 <head> 中。标签，它确实有效。
这是 jsfiddle 的链接这里是live version的链接.我会检查第二个链接上的输出，看看它与您的代码之间有什么区别。
希望您的问题得到解决!
关于javascript - Ember.js 待办事项应用程序 Handlebars 模板问题，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/21804046/