0

我从 Ember.js 开始，我需要一些帮助。

我有下面的两个车把。它们非常简单：只显示图像列表，如果用户单击其中一些图像，则会在车把#paintings 内的 {{outlet}} 上打开它。

所有这些都运行良好。但是当用户访问 index#/paintings 时我需要显示一个默认图像，并且它需要是画图数组的第一项（模型 FIXTURES）。

当用户加载索引#/paintings 时，我真的无法发现如何在车把#paintings {{outlet}} 内自动打印车把#painting。

非常感谢！

  <script type="text/x-handlebars" id="paintings">
    <div class="left">{{outlet}}</div>
    <div class="right">
      <ul>
        {{#each}}
          <li>
            {{#link-to 'painting' this}}
              <img {{bind-attr src=thumbnail}} {{bind-attr alt=name}}>
            {{/link-to}}
          </li>
      {{/each}}
      </ul>
    </div>
    <div class="clear"></div>
  </script>
  <script type="text/x-handlebars" id="painting">
    <img {{bind-attr src=link}} />
  </script>
4

3 回答 3

1

您是否尝试过重定向？我认为你可以做这样的事情。

App.Router.map(function() {
  this.resource('paintings');
  this.resource('painting', { path: '/painting/:painting_id' });
});

App.PaintingsRoute = Ember.Route.extend({
  afterModel: function(paintings, transition) {
    this.transitionTo('painting', paintings[0]);
  }
})
于 2013-11-06T13:56:20.810 回答
0

只需在集合中设置您的第一个对象，您可以从您的路由器执行此操作，我从您的代码中假设某些内容，但您应该明白：

App.PaintingsRoute = Ember.Route.extend({
    /**
     * guessing model here is the collection of paintings
     */
    setupController: function(controller, model) {
        var paintingController = this.controllerFor('painting');
        paintingController.set('content', model.get('firstObject'));
        controller.set('content', model);
    }
});
于 2013-11-06T13:54:03.093 回答
0

非常感谢大家！

更好的选择（我认为）是使用渲染模板：

App.PrintsRoute = Ember.Route.extend({
  // ...
  renderTemplate: function(controller, model) {
    this.render('prints'); // the list of prints

    controller = this.controllerFor('print');
    controller.set('content', model.get('firstObject')); //loads the default print
    this.render('fullsize', {outlet: 'fullsize', controller: controller, into: 'prints'}) //shows it in the right place
  }
});
于 2013-11-08T01:36:39.833 回答