Question

关注http://emberjs.com/guides/routing/rendering-a-template/我

<body>   
  <script type="text/x-handlebars">
    <h2> Welcome to Ember.js</h2> 
    <div class="lists">{{outlet lists}}</div>
    <div class="list">{{outlet list}}</div>  
  </script>

  <script type="text/x-handlebars" data-template-name="lists">
    <h3> some List Names</h3>    
  </script>

  <script type="text/x-handlebars" data-template-name="list">
    <h3> a list selected from lists</h3>    
  </script>    
</body>

JS

App = Ember.Application.create();

App.Router.map(function() {
  this.resource('lists', {path: "/"});
});

App.ListsRoute = Ember.Route.extend({
  renderTemplate: function(){
    this.render({outlet: 'lists'});
  }
});
App.ListRoute = Ember.Route.extend({
  renderTemplate: function(){
    this.render({outlet: 'list'});
  }
});

我希望看到

欢迎来到Ember.js

一些列表名称

所选列表名称列表

但这打破了这个jsbin：http://jsbin.com/cuyuy/6/edit。我仍然想知道如何在一个页面上呈现多个模板？

Answer 1

很难用这个上下文给出一个好的答案，但是如果你添加

，你的例子就会起作用

this.render('list', {
      outlet: 'list'
    });

来自ListsRoute的renderTemplate挂钩。见http://jsbin.com/cuyuy/8/edit

编辑：由于上面的代码并不是真正的余烬，请查看带有嵌套路线的jsbin：http://jsbin.com/hutem/1/edit

Ember-如何在一个页面上呈现多个模板？

欢迎来到Ember.js

一些列表名称

所选列表名称列表

1 个答案: