オブジェクトの配列内に新しく追加されたアイテムを編集し、DOMを更新します

Question

ここにはJSFiddleがあります。

以下のように見えるオブジェクトの配列：

var data = [{ 
    "ConferenceUsers": [{ 
    "Id": 3006, 
    "ConferenceId": 8, 
    "Name": null, 
    "Email": "mail@lala.com", 
    "UserName": null, 
    "PhoneNumber": "234234234234" 
    }], 
    "Id": 8, 
    "Subject": "YYYhaaaaa", 
    "StartTime": "2016-05-29T18:30:00", 
    "EndTime": "2016-05-29T19:30:00", 
    "OrganizerEmail": "elpas@live.com", 
    "OrganizerName": "dasdasd", 
}, { 
    "ConferenceUsers": [{ 
    "Id": 3013, 
    "ConferenceId": 12, 
    "Name": null, 
    "Email": "dsfdfsdfdsf@dfdfdf.com", 
    "UserName": null, 
    "PhoneNumber": null 
    }], 
    "Id": 12, 
    "Subject": "dsfsdfdsfsdf", 
    "StartTime": "2016-05-31T22:00:00", 
    "EndTime": "2016-05-31T23:00:00", 
    "OrganizerEmail": "d@adssad.com", 
    "OrganizerName": "dsfdsfsdf" 
}]; 

に私は新しいConferenceUsersを追加して編集できるようにする必要があります。

新しいユーザーの追加は機能しますが、編集することはできません。

ConferenceUserのViewModel：

var ConferenceUser = function (user) { 
    this.ConferenceId = ko.observable(user.ConferenceId); 
    this.Email = ko.observable(user.Email); 
    this.Id = ko.observable(user.Id); 
    this.Name = ko.observable(user.Name); 
    this.PhoneNumber = ko.observable(user.PhoneNumber); 
}; 

ConferenceListのViewModelとマッピング：

var createConferenceUser = function (user) { 
    return new ConferenceUser(user); 
}; 

var ConferenceList = function(conferencesJSON) { 
    var self = this; 

    var users = []; 
    for (i = 0; i < conferencesJSON.length; i++) { 
     users.push(conferencesJSON[i].ConferenceUsers); 
    } 

    this.conferences = ko.observableArray(conferencesJSON.map(createConference)); 
    this.conferenceUsers = ko.observableArray(users.map(createConferenceUser)); 

    this.addConference = function(conferenceJSON) { 
    self.conferences.push(createConference(conferenceJSON)); 
    }; 
}; 

ko.applyBindings(new ConferenceList(data)); 

Q：私はまた、のような既存/新規に追加されたConferenceUsersとDOMを更新するにはどうすればよいですjsFiddleにありますか？