0

给定路线，EmberJS 是否可以检索选择框（AKA 下拉菜单）的状态？

这将是我的用户故事，它相当简单：

用户想要通过位于顶部的选择菜单过滤项目列表。选择一个项目后，列表会自动过滤。过滤器的状态保存在 URL 中，使用户能够检索选择。

URL: http://example.com/#/2   -> where 2 corresponds to an item in the filter

------------------------------
| Select an item         \/  |
------------------------------

* Item 1
* Item 2
* Item 3

这将是我的选择视图：

App.CitySelectView = Ember.Select.extend({
    contentBinding: "App.cityController.cities",
    optionLabelPath: "content.name",
    optionValuePath: "content.uid",
    selectionBinding: "App.cityController.selected"
});

模板看起来像这样。

{{view App.StateSelectView id="form-select-state" prompt="Select an item"}}

我需要一个路由器，但我不知道如何编写它。例如，我缺少的是在选择视图上编写 {action} 的能力，这应该在“更改”时触发。

你能帮我吗？

附言。我的管道中有这个链接与路由相关https://gist.github.com/2728699

4

1 回答 1

1

处理此问题的一种简单方法是观察控制器中的选定值，然后使用发送事件将更改的值传递给路由器。在路由器中，您可以调用 transitionTo 来更改 url 并执行过滤。

在 App.CityController 中：

selectedChanged: function() {
    App.router.send('filterDropDown', this.get('selected'));
}.observes('selected')

在 App.Router 中，定义的发送给路由器的事件被调用：

filterDropDown: function(router, context) {
    router.transitionTo('filter', context.uid);  //pass the uid as url param
}

在 enter 事件中定义路由并处理过滤：

filter: Em.Route.extend({
    router: '/:selected',
    enter: function(router, context) {
        // Handle filtering here, with selected uid as context.selected
    }
})

您可能需要弄乱序列化和反序列化以使其适用于您的情况。

于 2012-12-12T15:56:14.213 回答