Select binding to array - strategies anyone?

I keep hitting this problem and need a definitive strategy to get this working - it is really giving me a negative experience of Aurelia as it just seemed to work so straightforwardly in Knockout.

So I have a view model which has an array of objects - Array1. I have a another array (Array2) which is to contain filtered subset of the first array. The event aggregator subscribes to an event which is used to create the filtered array. When the event is received it uses <array.prototype.filter> to create/update Array2.

I have a select control in the view which is bound to Array2, i.e. repeat.for=“obj of Array2”.

I simply cannot get the select control to show the new options when the event is received. I have tried:

  1. making Array2 a computed property
  2. making Array2 a property (with dirty checking)
  3. created a value converter to filter the array in the view

I cannot get changes in Array2 to bind to the select options.

What am I doing wrong?

Any help much appreciated.


Can you show your code in gistrun? Please minimise the code to just demo the issue.

Thanks @huochunpeng - I will do that and get back to you. Might take a day as involved in some other projects at the moment. I very much appreciate your support.