Knockout multiple select selectedOptions nie wybrano przy załadowaniu

Question

Tworzę formularz edycji dla użytkownika, role użytkownika nie są domyślnie wybierane podczas wielokrotnego wyboru.

Dostępne są dwie role aplikacji: "Administrator" i "Moderator". Przykładowy użytkownik ma 1 rolę "Administrator". Ten nie jest domyślnie wybrany.

http://jsfiddle.net/jgT8s/4/

html:

<form data-bind="with: user"> 
    <select id="selectRoles" 
     data-bind="options: $root.allRoles, selectedOptions: Roles, optionsText: 'Name', optionsValue: 'Id'" 
     multiple="true" 
     size="5"> 
    </select> 
</form> 

JS:

var User = function() { 
    var self = this; 

    self.Id = ko.observable(1337); 
    self.Username = ko.observable('pietpaulusma'); 
    self.Roles = ko.observableArray([{ Id: 1, Name: 'Administrator' }]); 
}; 

function UserViewModel() { 
    var self = this; 

    self.user = ko.observable(new User()); 
    self.allRoles = ko.observableArray([{ Id: 1, Name: 'Administrator' }, { Id: 2, Name: 'Moderator' }]); 
} 

ko.applyBindings(new UserViewModel()); 

UPDATE stworzył dependentObservable i odwzorowany, że jeden do selectedOptions

self.RoleIds = ko.dependentObservable(function() { 
     return ko.utils.arrayMap(self.Roles(), function (role) { 
      return role.Id; 
     }); 
    }); 

wersja robocza: http://jsfiddle.net/jgT8s/5/

Answer 1

Problemem jest to, że Roles zawiera „pełny” obiekt natomiast powinien on zawierać tylko część wartość:

self.Roles = ko.observableArray([1]); 

Spójrz tutaj: http://jsfiddle.net/Vkda5/

Answer 2

Knockout musi porównać wybrane opcje o wartości, która jest Id w tym przypadku: optionsValue: 'Id'. I przechodzisz przez szereg obiektów Role. Trzeba przekazać tablicę Id zamiast:

var User = function() { 
    ... 
    self.Roles = ko.observableArray([1]); 
};