Issues using computed.filter and computed.sort together


#1

In my app I need to filter a list by one or more properties then sort the filtered results by one or more properties. I’ve accomplished this with

  sortProperties: ['manufacturer:asc', 'modelName:asc', 'series:asc'],
  
  filteredContent: Ember.computed.filter('model', function (model) {
    return model.get('isActive');
  }).property('model.@each.isActive'),
  
  sortedContent: Ember.computed.sort('filteredContent', 'sortProperties').property('filteredContent')

The template binds to sortedContent via a normal {{#each item in sortedContent}}

My issues come when trying to edit an item in that list. Editing the first two items in the list is fine - changing the fields shows the changes in the list with no issues. The problem comes when editing anything lower than the first two items. Any changes get reflected on the proper item as well as other items in the list.

I’ve created a jsbin that shows the issue. I’m not sure if I’m just missing something on how I’m filtering/sorting/binding or if this is a bug within Ember.


#2

Cross-posted at Stack Overflow


#3

Solved at SO. Seems I was getting too cute with my filtering and sorting. I was originally using a post by @balint for the sorting and then combining that with the filtering. I guess the question now is - should the way I was originally performing the filter/sort work?


#4

This is indeed very strange. I made a few simplifications and tried to track down and eliminate the error but I’m too tired now to go on.

It seems that when you start to edit one of the edits from the lower 3, other items in the list will take up the id of the edited item and thus they are being edited, too. This has nothing to do with also filtering the content and I commented out the filtering to show this. Here is the jsbin if anyone cares to take it up, I’m more than interested where this goes wrong.


#5

I think I may have come across something similar a few days ago, it may have to do with multiple sort properties.

Edit: This seems to be relevant: https://github.com/emberjs/ember.js/pull/9356

Tldr: It should work how you expect, but doesn’t.


#6

I believe #5268 is the parent issue on Github. It looks like the core team is aware of the problem but lacks the resources to properly address it at the moment (although @mmun looks like he might be taking it on?) Regardless it is on the core teams radar.