谢谢你在这种情况下能提供的任何帮助..。
我正在尝试构建类似于Amazon过滤器侧边栏的功能。当选择类别的一个筛选器时,除主要内容外,其他筛选器类别也会被过滤。
假设我正在建造一家销售shirts和pants的商店。color和size都可以对它们进行过滤。
ShopRoute为color和size加载模型。
路线:/shop/shirts /shop/pants
+---------------------------------------+
| Shop |
| +-----------+ +---------------------+ |
| | Filters | | {{outlet}} | |
| | Color | | (/shirts | |
| | blue | | or | |
| | red | | /pants) | |
| | green | | | |
| | Size | | | |
| | S | | | |
| | M | | | |
| | L | | | |
| +-----------+ | | |
| | | |
| | | |
| +---------------------+ |
+---------------------------------------+旁边的过滤器是单选按钮;也就是说,一次只能选择一个color,每次只能选择一个size。
假设我在/shop/shirts,我选择green。目前,在绿色衬衫的x数量中,唯一可用的尺码是M和L。sizes应该被过滤,S不再是一个可选择的选项。
如果我在green上选择了/shop/shirts,那么当我访问/shop/pants时,过滤器应该保持不变,我应该只看到绿色裤子。如果所有大小都可用,S应该作为可选择的选项重新出现。
要清楚:也应该可以工作--反之亦然。如果在选择size之前选择了color,则应该对colors进行筛选,以反映colors在该size中的可用性。
到目前为止,我的ShopController是这样开始的:
App.ShopController = Ember.ArrayController.extend(
colorFilter: null
sizeFilter: null
)我发现了很多简单的“Hello”过滤例子。现在,我在解决方案的体系结构上遇到了麻烦,在Ember的实体(Model,Route,Controller,View,.)中迷失了方向。以及它们是如何互动的。
在设置/重置这些选项时,如何从此控制器(或其他地方)筛选所有显示的color、size、shirt和pants记录?
发布于 2014-12-13 07:56:36
您应该将控制器与需求一起使用。我建议建立两个控制器
第一个将管理过滤器/边栏。当用户选择侧栏中的任何筛选器时,其属性将发生更改。
App.SideBarController = Ember.Controller.extend(
selectedColor: ['Green','Blue'],
selectedSize: ['XL'],
)现在,第二个将是常规列表控制器,让我们说ShopListing。在这里,您可以使用类似的东西引用带有Live的Sidebar过滤器。
当您在侧栏控制器(通过某些筛选器选择/取消选择)中更改绑定更新时,会自动更新
App.ShopListingController = Ember.ArrayController.extend({
needs : ['SideBar'],
//side bar live bound property for selected colors
selectedColor : Ember.computed.alias('controllers.SiderBar.selectedColor'),
//side bar live bound property for selected size
selectedSize : Ember.computed.alias('controllers.SiderBar.selectedSize'),
//write some code here to get only filtered result
filteredListing : Ember.computed('model.@each','selectedSize','selectedColor',function(){
//do some magic here
})
})希望它能给你一些帮助
也请看一下绑定
https://stackoverflow.com/questions/27455189
复制相似问题