1

给定一个产品列表页面，其中一些过滤器 ( query, status, page, perPage) 不能一起使用：

  • 当用户写入 aquery时，status应清除过滤器，并将其page设置为 1。
  • 当用户选择一个status过滤器时，query过滤器应该被清除，并page设置为 1。
  • 当用户更改 时perPage，page设置为 1（其他过滤器保持原样）
  • 当用户更改 时page，过滤器保持原样。

这是我尝试实现它的方法：

App.ProductsController = Ember.ArrayController.extend({
  query: null,
  status: null,
  page: 1,
  perPage: 15,

  queryDidChange: function() {
    this.setProperties({
      status: null,
      page: 1
    });
  }.observes('query'),

  statusDidChange: function() {
    this.setProperties({
      query: null,
      page: 1
    });
  }.observes('status'),

  perPageDidChange: function() {
    this.set('page', 1);
  }.observes('perPage'),

  parametersDidChange: function() {
    this.send('reloadModel');
  }.observes('query', 'status', 'page', 'perPage'),

  actions: {
    reloadModel: function() {
      // code omitted which makes API call using all filters set
    }
  }
});

但是当发生query变化时，queryDidChange观察者会被调用，这会清除status. 随着status改变，statusDidChange观察者被调用，这将清除query等。

这种解决方案可能不是最好的，但我想保留一种“Ember 方式”来做到这一点，并且只使用公共 API（例如 not _suspendObservers）。

我怎么能做到这一点？也许在某处使用运行循环？

编辑

另请注意，我知道视图可以发送操作而不仅仅是更改属性，因此控制器将如下所示：

 App.ProductsController = Ember.ArrayController.extend({
   actions: {
     queryDidChange: function() {
       this.setProperties({
         status: null,
         page: 1
       });
       this.send('reloadModel');
     },
     // code omitted
   }
 });

但是这个解决方案似乎有点冗长，并且不使用观察者和绑定能力，所以我希望有一种方法可以更好地做到这一点。

4

1 回答 1

0

我不知道如何在 Ember 中暂停观察者，但你可以通过观察者函数中的条件来实现这一点

queryDidChange: function() {
  if(this.get('query')){
    this.setProperties({
      status: null,
      page: 1
    });
  }
}.observes('query'),

statusDidChange: function() {
  if(this.get('status')){
    this.setProperties({
      query: null,
      page: 1
    });
  }
}.observes('status'),
于 2013-10-17T09:52:40.467 回答