Ember.js 嵌套路由

Question

干杯！我有路线：

TravelClient.Router.map(function() {
  this.resource('tours', function() {
    this.resource('tour', { path: ':tour_id' }, function(){
      this.route('seats');
    });   
  });
});

还有一个模板：

  <script type="text/x-handlebars" data-template-name="tour/seats">
    {{...}}
  </script>

座位是 Tour 对象的一个​​属性：

TravelClient.Tour.find(1).get('seats');
12

我像这样扩展我的 TourSeats 路线：

TravelClient.TourSeatsRoute = Ember.Route.extend({
  model: function(params) {
    return TravelClient.Tour.find(params.tour_id).get('seats');
  }
});

问题：如何在模板中渲染游览的座位？

更新：

我的灯具是这样的：

TravelClient.Store = DS.Store.extend({
  revision: 11,
  adapter: 'DS.FixtureAdapter'
});

TravelClient.Tour = DS.Model.extend({
  title: DS.attr('string'),
  description: DS.attr('string'),
  seats: DS.attr('number')
});

TravelClient.Tour.FIXTURES = [{
  id: 1,
  title: "Brighton, England",
  description: "Lorem ipsum dolor ... .",
  seats: 12
},...

我已经改变了我的路线延伸到这个：

TravelClient.TourSeatsRoute = Ember.Route.extend({
  model: function(params) {
    return TravelClient.Tour.find(params.tour_id);
  }
});

在模板中：

  <script type="text/x-handlebars" data-template-name="tour/seats">
    {{tour.seats}}
  </script>

更新 2：

  <script type="text/x-handlebars" data-template-name="tour/seats">
    {{controller.model.seats}}
  </script>

它会返回 undefind。 经过一番调试，我发现params中没有任何id并且params为空，这就是为什么我无法在TourSeatsRou​​te函数中获得正确的模型。

Answer 1

如果您使用的是 ember-1.0-pre.4+，则只会为您所在的特定路线返回参数，而不是整个 URL。有一些discussion about this here。

我相信此时所需的方法是使用this.modelFor 传递您在父路由中设置的父资源的名称。所以在你的情况下，它会是：

TravelClient.TourSeatsRoute = Ember.Route.extend({
  model: function() {
    return this.modelFor("tour");
  }
});

Answer 2

我还是 EmberJS 的新手，但我会像这样编写我的路由器和路由。

我不确定您是否需要将 post 资源包装在 posts 资源中。注意 ToursSeatsRou​​te 中的双复数

TravelClient.Router.map(function() {
  this.resource('tours', function() {        
    this.route('/:tour_id/seats');        
  });
});

这将为您提供以下网址：

/tours - 你可以把它映射到一个 ArrayController

/tours/:tour_id/seats - 您可以将其映射到 ObjectController

TravelClient.ToursSeatsRoute = Ember.Route.extend({
  model: function(params) {
    console.log(params); 
    return TravelClient.Tour.find(params.tour_id);
  }
});

试一试？或者也许将您的代码放在 JSFiddle 中？

Answer 3

您只需要从model 方法返回模型：

TravelClient.TourSeatsRoute = Ember.Route.extend({
  model: function(params) {
    return TravelClient.Tour.find(params.tour_id);
  }
});

然后在您的模板中，您可以执行以下操作，其中controller 是上下文：

{{model.seats}}