使用 Ember.js 过滤子记录(hasMany 关联) [英] Filter child-records (hasMany association) with Ember.js

问题描述

是否有可能从模型记录中过滤 hasMany 记录?我想获取按客户分组的活动项目.

Is there any possibility to filter the hasMany records from a model record? I want to get the active projects, grouped by the customer.

客户模型

Docket.Customer = DS.Model.extend({
  name:        DS.attr('string'),
  initial:     DS.attr('string'),
  description: DS.attr('string'),
  number:      DS.attr('string'),
  archived:    DS.attr('boolean'),
  projects:    DS.hasMany('project',{ async: true })
});

项目模型

Docket.Project = DS.Model.extend({
  name:        DS.attr('string'),
  description: DS.attr('string'),
  number:      DS.attr('string'),
  archived:    DS.attr('boolean'),
  customer:    DS.belongsTo('customer', { async: true })
});

项目路线

Docket.OrganizationProjectsIndexRoute = Docket.AuthenticatedRoute.extend({
  setupController: function () {

    var customersWithActiveProjects = this.store.filter('customer', function(customer) {
      return customer.get('id') && GET_ONLY_ACTIVE_PROJECTS_FROM_CUSTOMER?
    });

    this.controllerFor('organization.projects').set('filteredProjects', customersWithActiveProjects);
  }
});

更新

我试过这样的事情，但它不起作用.我认为这是异步请求引起的问题.但它指向正确的方向吗?

Update

I tried something like this but It does not work. I think this is a problem caused by asynchronous requests. But does it point in the right direction?

Docket.OrganizationProjectsIndexRoute = Docket.AuthenticatedRoute.extend({
  setupController: function () {

    // get customers because we group projects by customers
    var customers = this.store.filter('customer', function(customer) {
      return customer.get('id')
    });

    var sortedProjects;

    // loop through each valid customer and filter the active projects
    $.when(

      customers.forEach(function(customer){
        customer.get('projects').then(function(projects) {

          var filteredProjects = projects.filter(function(project){
            return !project.get('archived')
          });

          customer.set('projects',filteredProjects);
        });

      })

    ).then(function() {

        sortedProjects = Ember.ArrayProxy.createWithMixins(Ember.SortableMixin, {
          sortProperties: ["name"],
          content: customers
        });

    });

    this.controllerFor('organization.projects').set('filteredProjects', sortedProjects);

  }
});

推荐答案

我认为以下方法可行:

控制器

Docket.OrganizationProjectsIndexRoute = Docket.AuthenticatedRoute.extend({
  setupController: function () {

    var projectsController = this.controllerFor('organization.projects');

    this.store.find('customer').then(function(customers) {
      var promises =  customers.map(function(customer) {

        return Ember.RSVP.hash({
          customer: customer,
          projects: customer.get('projects').then(function(projects) {
            return projects.filter(function(project) {
              return !project.get('archived');
            });
          });
        });             

      });

      Ember.RSVP.all(promises).then(function(filteredProjects) {
        projectsController.set('filteredProjects', filteredProjects);
      });

    });            

  }
});

模板

{{#each filtered in filteredProjects}}
  Customer {{filtered.customer}}<br/>
  {{#each project in filtered.projects}}
    Project {{project.name}}<br/>
  {{/each}}
{{/each}}

诀窍是使用 Ember.RSVP.hash 将每个分组活跃项目的客户.

The trick is use Ember.RSVP.hash to group each customer by active projects.

这篇关于使用 Ember.js 过滤子记录(hasMany 关联)的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！