Question

在Ember中，我想通过相同的路径处理以下网址：

/due：显示截止日期的所有任务。
/due-past：显示过去截止日期的所有任务。
/due-today：今天显示所有截止日期的任务。
/due-tomorrow：明天显示截止日期的所有任务。
/due-this-week：本周显示所有截止日期的任务。
/due-next-week：下周显示截止日期的所有任务。
/due-this-month：显示本月截止日期的所有任务。

我想象的是我会通过相同的路线捕获所有网址并使用“when”部分（“过去”，“今天”，“明天”等）来过滤该路线上的模型。但我迷路了，不知道在哪里寻找答案。

例如：

app/router.js：

Router.map(function() {
    this.route('due', { path: '/due-:when' });
});

但是this doesn't work。

也许我很困惑，也不理解Ember的概念。 什么是Ember方式？

更新

既然我明白动态部分必须是一个片段，我不得不做更多这样的事情：

Router.map(function () {
    this.route('due');
    this.route('due', {path: '/due/:when'});
});

但我意识到{{#link-to 'due'}}Due{{/link-to}}只是点击了/due/undefined网址，所以/due永远不会被击中。我想我放弃了due路线并且只有/due/all？ Oy公司。每分钟都有另一种妥协。

Answer 1

您可以使用此期间的嵌套路线创建到期路线。网址看起来像这样：

  /due
  /due/:period

在到期期间，您将获取所有任务，并且在期间路线中，您可以访问路线model-hook中params参数中的期间参数。

有关详细信息，请参阅http://emberjs.com/guides/routing/defining-your-routes/#toc_dynamic-segments。

我想的Ember方式或者我实现这样的方式是使用新的query-params feature并在due-Controller上声明:period - 动态段查询参数。有了这个，你最终只能得到一条能够过滤到期任务的路线。

您还可以指定是否要在期间更改时查询服务器，或者您是否只想过滤已经提取的到期任务，考虑到您需要获取/due - 路由的所有任务反正。

如果due - 路线中存在某种分页，您需要在不同时段查询服务器。有关详细信息，请参阅Opting into full transitions。

我认为查询参数是这里的方法因为句点路径不是真正的嵌套资源，并且可能会显示与due - 路由相同的接口。唯一区分两种“种类”路线（due和due-period）的是过滤。因此，我在这里选择查询参数方法。

Answer 2

如果这些是您想要的路线，那么您没有理由不能这样做。此路由器映射应该为您提供该布局：

App.Router.map(function() {
    this.resource('due'),
    this.resource('past-due'),
    this.resource('due-today'),
    this.resource('due-tomorrow'),
    this.resource('due-this-week'),
    this.resource('due-next-week'),
    this.resource('due-this-month')
});

虽然，我可能会选择这样的事情：

App.Router.map(function() {
  this.resource('due', function() {
      this.resource('today'),
      this.resource('tomorrow'),
      this.resource('this-week'),
      this.resource('next-week'),
      this.resource('this-month')
    });
    this.resource('past-due');
});

然后您的路线将是：

#/due
#/due/today
#/due/tomorrow
#/due/this-week
#/due/next-week
#/due/this-month
#/past-due

如果您使用route或resource，这并不重要，建议您使用resource作为顶级项目，使用routes动词如new或edit。

当需要获取模型时，您只需要对要检索的值进行硬编码，如下所示：

App.PastDueRoute = Ember.Route.extend({
   model:function() {
        this.store.find('todo',{due:'past-due'});
   }
});

您可以通过以下方式链接到路线：

{{#link-to 'past-due'}}Past Due{{/link-to}}

如果您还没有，我强烈建议您在Chrome中安装Ember Inspector并使用它来查看您的应用，特别是您的路线。这将真正帮助您了解您所定义的内容。

在Ember，多个URL，相同的路由/控制器/视图/逻辑，不同的过滤器？

更新

2 个答案: