0

我正在学习 ember,我有一个问题:我应该将模板文件放在哪里?假设我正在使用 requirejs 来模块化我的应用程序。如果我index.html在入门套件中定义我的 as:

 <script type="text/x-handlebars">
<h2>Welcome to Ember.js</h2>

{{outlet}}
</script>
 <script type="text/x-handlebars" data-template-name="index">

 <ul>
  {{#each item in model}}
  <li>{{item}}</li>
 {{/each}}
 </ul>
</script>

我的应用程序正常工作。但是,如果我想将index模板移动到项目中的另一个文件中,比如说js/templates/index.html. 我如何告诉 ember,模板在那个目录中?在这种情况下我必须使用视图吗?有renderTemplateRoute的方法,但是不知道怎么告诉它从目录中取出模板:

define(['ember','text!templates/index.html'],function(ember, indexTemplate){
var IndexRoute = Ember.Route.extend({
    renderTemplate: function(){
        this.render(indexTemplate); // clearly this is not the solution, I just don't know how to refer to the indexTemplate.
    },
    model: function(){
        return ['red','blue','yellow'];
    }
});

return IndexRoute;
});

由于该renderTemplate方法等待一个字符串来确定要呈现的模板的名称,所以我不知道如何告诉 ember,该模板实际上在另一个文件中,而不是在应用程序index.htmltemplates/index.html.

4

2 回答 2

1

基本上require.js你根本不需要使用renderTemplate来渲染你的模板。如果您不需要在视图中做额外的事情,您甚至不需要定义视图。此外,您可以将您定义的模板index.html分离到单独的把手文件中*.hbs,或者*.handlebars以正确的顺序加载此模板文件。

看看这个require.js用于加载项目文件的项目:

  1. https://github.com/sh4n3d4v15/ember-todos
  2. https://github.com/stephenplusplus/todomvc/tree/emberjs_require/dependency-examples/emberjs_require
  3. https://bitbucket.org/cprecourt/ember-requirejs-example/src

希望能帮助到你。

于 2013-06-21T16:56:32.747 回答
1

require.js使用 Ember.js 时根本不用使用。Ember.js 使用Handlebars作为其模板引擎,因此您可以将模板编写在名称应以.handlebarsor结尾的单独文件中.hbs

然后,您需要预编译您的模板文件,此过程需要您使用Node.jsand npm,结果所有模板文件都成为一个 javascript 文件。毕竟你只是在你的条目 HTML 中链接了这个文件,把它放在你链接到的位置之后,ember.js这样 Ember 就会识别这些模板的名称。这就是为什么所有View类都会从他们的属性中知道名称的原因renderTemplate

如果您有大量模板并且不希望仅将它们加载到一个.js文件中,则可以选择单独编译它们并require.js在以后使用它们来管理依赖项,这对 Ember 来说很好。

要查看有关 Handlebars 预编译的更多信息,请查看此链接:http ://handlebarsjs.com/precompilation.html

于 2013-06-21T18:09:22.677 回答