Ember.Select works sometimes but assertion fails - ember.js

Question

In my ember.js app, I have a 'user' model that has a "hasMany" relationship to 'group'. A user can be a member of zero or more groups. To allow the user to select the groups, I am using the built-in Ember.Select view.
If I load my users via the route /users, I can see the user and the groups to which that user is assigned. If I go to the edit route (/users/1/edit), I use Ember.Select to show the universe of all groups, along with the selection of that user's "selected" groups. Unfortunately, when I transition via the /users route, none of the groups are selected. If I refresh the page on the edit route, I see the groups correctly selected as I expect.
Another thing to note is that I don't see any errors when transitioning from /users to /users/1/edit (with no selected groups). However, when I refresh directly from the /users/1/edit route, the selection works correctly, but I see the following in the console (I am including a bit of the stack):
Assertion failed: The content property of DS.PromiseArray should be set before modifying it ember.js:394
(anonymous function) ember.js:394
Ember.assert ember.js:53
Ember.ArrayProxy.Ember.Object.extend._replace ember.js:16284
Ember.ArrayProxy.Ember.Object.extend.replace ember.js:16291
Ember.EnumerableUtils.replace ember.js:1829
Ember.Select.Ember.View.extend._changeMultiple ember.js:27933
Ember.Select.Ember.View.extend._change ember.js:27859
Ember.Select.Ember.View.extend._triggerChange ember.js:27902
sendEvent ember.js:2334
Any pointers would be helpful!
user_model.js:
Usermanagement.User = DS.Model.extend({
authenticateExternally: DS.attr(),
email: DS.attr(),
enabled: DS.attr(),
firstName: DS.attr(),
lastName: DS.attr(),
password: DS.attr(),
systemExternalAuthenticationEnabled: DS.attr(),
selectedGroups: DS.hasMany('group', {
async: true
}),
username: DS.attr(),
meta: DS.attr(),
fullName: function() {
return '%# %#'.fmt(this.get('firstName'), this.get('lastName'));
}.property('firstName', 'lastName'),
});
user_edit_template.hbs: (snippet)
<div class="field form-group">
<div class="fieldLabel">Groups</div>
{{view Ember.Select
multiple="true"
class="form-control"
selectionBinding="selectedGroups"
contentBinding="controllers.groups.allGroups"
optionLabelPath="content.name"
optionValuePath="content.id"}}
</div>
groups_controller.js:
Usermanagement.GroupsController = Ember.ArrayController.extend({
allGroups: function() {
return this.store.find('group');
}.property()
});
EDIT: Forgot to mention, Ember v1.0.0, Ember-data v1.0.0-beta3

Answer 1

The error is complaining about the select mucking with your model (user.selectedGroups) before it's finished loading.
The reason none are selected is probably because they are probably different objects. You might iterate over each item in the selected items and the allGroups options and check out the ember guid on it, if they are different items then that's why it's not showing them as selected.
Just out of curiosity, can you try setting the controller in the application route's setupController?
App.ApplicationRoute = Em.Route.extend({
setupController: function(controller, model){
this._super(controller, model);
this.controllerFor('groups').set('model', this.store.find('group'));
}
});
{{view Ember.Select
multiple="true"
class="form-control"
selectionBinding="selectedGroups"
contentBinding="controllers.groups.model" //instead of allGroups
optionLabelPath="content.name"
optionValuePath="content.id"}}