2

如果我有这样的嵌套路线

App.Router.map(function() {
  this.resource("foo", {path: "/foos"}, function( {
    this.resource("bar", {path: "/:foo_id/bars"}, function() {
      this.resource("bazz", {path: "/:bar_id"});
    });
  });
});

当我启动应用程序时,我需要一个 FooIndexRoute 来加载所有 foo 对象。然而,当我在最底部的路线刷新时,我的 FooIndexRoute 没有加载,所以我不得不在我的 FooRoute 中复制模型钩子

我在迫使我重复这项工作的 url 结构中做错了什么?

4

2 回答 2

2

我发现当基本路由 ( foo) 用于加载模型列表并且索引 ( foo.index) 用于显示列表时,它的效果最好。这是一个优势,因为路线{{outlet}}中的foo最初将充满foo.index视图,但是一旦您选择了要深入了解foo的出口,就会切换到bar路线的信息。foo这通过嵌套保留了 的控制器和模型数据。

application
├── foo
│   ├── bar
│   │   ├── bazz
│   │   └── index
│   └── index
└── index

您可以看到,如果您在foo.index路由中加载数据,当您转换到bar路由时,嵌套路径现在不包含foo.index,这意味着它不容易访问。

在子路由中,您可以使用它this.modelFor('foo')来检索foo路由的模型,并直接将其用作模型或将其添加到路由的控制器中:

App.FooRoute = Ember.Route.extend({
  model: function() {
    return ['red', 'yellow', 'blue'];
  }
});

// use foo's model as the index's model
App.FooIndexRoute = Ember.Route.extend({
  model: function() {
    return this.modelFor('foo');
  }
});

// this route has its own model, but also include foo's model
App.BarRoute = Ember.Route.extend({
  model: function() {
    return ['bar1', 'bar2', 'bar3'];
  },
  setupController: function(controller, model) {
    this._super(controller, model);
    controller.set('fooModel', this.modelFor('foo'));
  }
});

这是一个显示嵌套的 JSBin:http://emberjs.jsbin.com/oxAluJI/1/edit

于 2013-11-07T19:00:40.077 回答
1

索引路由是一条捕获所有路由,只有在您点击该资源并且您尚未定义默认路由时才会被命中。您应该在路由名称本身上定义模型挂钩并放弃索引路由。

又名

App.FooRoute = Em.Route.extend({
   model: function....
})

如果您希望索引路由仍然存在,您可以在索引路由的模型挂钩中使用return this.modelFor('foo');. 因此,您可以避免两次获取模型等。

此外,在您更深层次的路线中,如果他们的模型只是父路线的孩子,只需使用 modelFor 获取父模型并过滤掉适当的项目。

如果您需要 jsbin 示例,请告诉我。

于 2013-11-06T19:50:27.030 回答