Ember.js 按查询参数中的值筛选数组

我有一个帖子列表，我需要通过

社交网络

进行筛选，我正在使用查询参数进行筛选，我的问题是如何临时筛选模型，以便稍后我可以回来显示所有内容

路由帖子。索引为：

model(params) {
    return this.store.find('post');
  }

以及it的控制器：

export default Ember.ArrayController.extend({
  queryParams: ['social_network'],
  social_network: 'all',

  paramsDidChange: function() {
    var network = this.get('social_network');
    var posts = this.get('model');

    if(network === 'all') {
      return posts;
    }
    return posts.filterBy('social_network', network);
  }.observes('social_network', 'model'),
});

查看

{{#each post in model}}
    <li>
      {{post-index post=post}}
    </li>
  {{/each}}

{{#模型中的每个帖子}

{{post index post=post}}

{{/每个}}

不要使用观察者-只需在控制器中使用computed属性，并在模板中循环使用computed属性即可

控制器中的计算属性如下所示：

filteredStuff: function() {
  var network = this.get('social_network');
  var posts = this.get('model');

  if(network === 'all') {
    return posts;
  }

  return posts.filterBy('social_network', network);
}.property('social_network')

然后，在模板中：

<script type="text/x-handlebars" data-template-name="index">
  <ul>
  {{#each item in filteredStuff}}
    <li>{{item.title}}</li>
  {{/each}}
  </ul>
</script>

{{#filteredStuff中的每个项目}
{{item.title}
{{/每个}}

---

工作解决方案

现在建议将其用于此功能。

.property

和

.comments

都被弃用

我已经调整了Ember文档中的示例，以回答您的问题

import Controller from '@ember/controller';
import { computed } from '@ember/object';

export default Controller.extend({
  queryParams: ['socialNetwork'],
  socialNetwork: null,

  filteredPosts: computed('socialNetwork', 'model', function() {
    const socialNetwork = this.get('socialNetwork');
    const posts = this.get('model');

    if (category) {
      return posts('socialNetwork', socialNetwork);
    } else {
      return posts;
    }
  })
});

在模板中，您将使用

filteredPosts

属性。例如

{{#each post in filteredPosts}}
  <li>
    {{post-index post=post}}
  </li>
{{/each}}

{{#filteredPosts中的每个帖子}

{{post index post=post}}

{{/每个}}

---

有关更多信息，请参阅上的官方文档。

我的坏，我尝试了这种方法，但没有使用

.property

而使用

.observable

，这导致了一个错误。谢谢你的帮助。