1

我对 ember.js 非常陌生，我正在尝试为我的应用程序设置路由/资源App.Router.map，但是我在想出最有效/最干燥的方式来定义应用程序的路由时遇到了一些麻烦需要。

我想要一个资源items，它是进入应用程序时的默认路由，它显示一个由动态段过滤的项目列表:bucket，它必须是一组预定义的存储桶名称之一。即#/items/foo, 或#/items/bar, 其中foo和bar是有效值:bucket。

此外，该items路由还应该允许第二个段称为tag，然后必须跟随另一个动态段，该段是标记名称的 url 安全版本，即#/items/tag/my-tag。

我有第一部分工作，使用：

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

但是，我无法弄清楚如何tag在那里适应路线的版本。我已经尝试将它嵌套在items资源中以及作为它自己的顶级资源，但两者都不起作用。

4

1 回答 1

2

您可以像这样构建路由器：

App.Router.map(function() {
  this.resource('items', {path: '/items'}, function(){
    this.route('bucket', {path: '/:bucket'});
    this.route('tag', {path: '/tag/:tag'});
  });
});

这显示了所有Items#/items并按桶 at#/items/bucketNameHere和标签过滤器 at #/items/tag/tagNameHere。

如果所有项目都显示在ItemRoute：

App.ItemsRoute = Ember.Route.extend({
  model: function(){
      return this.store.find('item');
  }
});

ItemsBucketRoute然后您可以处理and中的过滤ItemsTagRoute：

App.ItemsBucketRoute = Ember.Route.extend({
  model: function(params){
    console.log("model fired");
    return this.modelFor('items').filterProperty('bucket', params.bucket);
  }
});

App.ItemsTagRoute = Ember.Route.extend({
  model: function(params){
    return this.modelFor('items').filterProperty('tag', params.tag);
  }
});

您还可以使用filterPropertyof arrayControllers完成列表过滤。

JSBin 示例

于 2013-10-11T17:42:15.307 回答