2013-08-22 28 views
0

我通过official documentation学习ember.js时遇到含有胡子模板下面的HTML页面:无法车把数据进入模板

<section id="main"> 
     <ul id="todo-list"> 
     {{#each controller}} 
     <li {{bindAttr class="isCompleted:completed"}}> 
      <input type="checkbox" class="toggle"> 
      <label>{{title}}</label><button class="destroy"></button> 
     </li> 
     {{/each}} 
     </ul> 

     <input type="checkbox" id="toggle-all"> 
    </section> 

然而,问题是,浏览器显示数据如:

{{#each controller}} 
    {{title}} 
{{/each}} 

而不呈现提供给模板的种子数据。 我有以下的javascript声明只是身体标记结束前:

<script src="js/libs/jquery.js"></script> 
    <script src="js/libs/handlebars.js"></script> 
    <script src="js/libs/ember.js"></script> 
    <script src="js/libs/ember-data.js"></script> 

    <script src="js/libs/application.js"></script> 
    <script src="js/libs/router.js"></script> 
    <script src="js/models/store.js"></script> 
    <script src="js/models/todo.js"></script> 

该页面加载而不被放火报告的任何错误。请让我知道我缺少什么。

回答

1

我想你错过了一些基本的东西 - 你的'模板'上的把手脚本标记,data-template-name应根据你所在的路线命名,这里我仅仅使用application作为示例。在你提到的官方指南中,如果你在嵌入式jsbin中启用了html面板,你会明白我的意思,就在body标签下是包装脚本标签todos

<script type="text/x-handlebars" data-template-name="application"> 
<section id="main"> 
    <ul id="todo-list"> 
    {{#each controller}} 
    <li {{bindAttr class="isCompleted:completed"}}> 
     <input type="checkbox" class="toggle"> 
     <label>{{title}}</label><button class="destroy"></button> 
    </li> 
    {{/each}} 
    </ul> 

    <input type="checkbox" id="toggle-all"> 
</section> 
</script> 

希望它有帮助。

+0

非常感谢,我一直在遵循入门用户指南,并没有提到附加脚本标记。 –