In Canjs 2.*, because I used the self.attr( ‘task_group.task_group_link_support_user’ ); The template would rerender availableUsers when the task_group.task_group_link_support_user had changed.
availableUsers: can.compute(function( viewModel ){
var self = this;
if( viewModel ) {
self = viewModel;
}
self.attr( 'task_group.task_group_link_support_user' );
return self.attr( 'users.list' ).filter(function( item, index ){
var found = false;
this.task_group.task_group_link_support_user.each( function( item2, index2 ){
if( item2.user_id == item.id ) {
found = true;
return false;
}
});
return !found;
}.bind( self ));
}),
I cannot get this to work in Canjs 3.2.1 by doing self.task_group.task_group_link_support_user.get();
availableUsers: Compute(function( ){
var self = new TaskGroupSupportUserViewModel;
self.task_group.task_group_link_support_user.get();
return self.users.list.filter(function( item, index ){
var found = false;
this.task_group.task_group_link_support_user.forEach( function( item2, index2 ){
if( item2.user_id == item.id ) {
found = true;
return false;
}
});
return !found;
}.bind( self ));
}),
The template
<select class="form-control" ($change)="selectUser( %context, %element, %event )">
<option value="">Select...</option>
{{#each availableUsers}}
<option value="{{id}}" data-index="{{@index}}">{{name}}</option>
{{/each}}
</select>
Thanks in advance!