Ember.js路线图

Question

我是ember.js的新手，我尝试在App.Router.map为我的应用程序设置路由/资源，但是我在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资源中，也作为其自己的顶级资源进行嵌套，但是都没有用。

Answer 1

您可以这样构造路由器：

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

这将显示#/items所有Item ，并按#/items/bucketNameHere的存储桶和#/items/tag/tagNameHere 。

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

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

然后，您可以在ItemsBucketRoute和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);
  }
});

您还可以使用filterProperty的arrayController完成列表过滤。

JSBin示例