Отображение нокаута Наблюдаемый массив MVC

Question

Привет, я много часов искал в Интернете, пытаясь решить это, но я не мог найти решение.

Я создаю решение с помощью ASP.NET MVC и нокаута. Контроллер возвращает параметры, которые пользователь может выбрать для представления, которое преобразует его в JSON, и использует плагин отображения для сопоставления его с нокаутом View Model. Он заполняется правильно, потому что, когда я это делаю: ko.toJSON ($ data), чтобы проверить его, вернутся правильные данные, но представление не будет обновлять список, когда элемент будет добавлен к нему.

Я предполагаю, что свойства не являются наблюдаемыми, но я не уверен, как это исправить.

Это пример JSON Возвращается:

[{ "Key": 1, "Значение": "Компания"}]

Это мой JavaScript:

function ProjectWorkedOn() { 
    var self = this; 
    self.client = ko.observable(); 
    self.job = ko.observable(); 
    self.project = ko.observable(); 
    self.workType = ko.observable(); 
} 

function createTimesheetViewModel() { 
    var self = this; 

    //list of options 
    self.UserClients = ko.observableArray(); 
    self.UserProjects = ko.observableArray(); 
    self.UserJobs = ko.observableArray(); 
    self.UserWorkTypes = ko.observableArray(); 

    //keep track of selected options 
    self.selectedClient = ko.observable(); 
    self.selectedProject = ko.observable(); 
    self.selectedJob = ko.observable(); 
    self.selectedWorkType = ko.observable(); 

    //list to add choices in 
    self.ListProjectsWorkedOn = ko.observableArray(); 


    self.addProjectWorkedOn = function() { 
     var project = new ProjectWorkedOn(); 
     project.client = self.selectedClient; 
     project.job = self.selectedJob; 
     project.project = self.selectedProject; 
     project.workType = self.selectedWorkType; 
     self.ListProjectsWorkedOn.push(project) 
    } 
    self.removeProjectWorkedOn = function (projectWorkedOn) { 
     self.ListProjectsWorkedOn.remove(projectWorkedOn) 
    } 

} 



$(function() { 
    var CreateTimesheetViewModel = new createTimesheetViewModel(); 

    CreateTimesheetViewModel.UserClients = ko.mapping.fromJSON('@Html.Raw(Newtonsoft.Json.JsonConvert.SerializeObject(Model.UserClients))'); 
    CreateTimesheetViewModel.UserProjects = ko.mapping.fromJSON('@Html.Raw(Newtonsoft.Json.JsonConvert.SerializeObject(Model.UserProjects))'); 
    CreateTimesheetViewModel.UserJobs = ko.mapping.fromJSON('@Html.Raw(Newtonsoft.Json.JsonConvert.SerializeObject(Model.UserJobs))'); 
    CreateTimesheetViewModel.UserWorkTypes = ko.mapping.fromJSON('@Html.Raw(Newtonsoft.Json.JsonConvert.SerializeObject(Model.UserWorkTypes))'); 

    ko.applyBindings(CreateTimesheetViewModel, document.getElementById("CreateTimesheet")); 
}); 

Это часть вида, который добавляет элементы в список:

<table> 
    <tr> 
     <td> 
      Projects Worked On: 
     </td> 
     <td> 
      Client: <select data-bind="options: UserClients, optionsText: 'Value', value: selectedClient"></select> 
     </td> 
     <td> 
      Project: <select data-bind="options: UserProjects, optionsText: 'Value', value: selectedProject"></select> 
     </td> 
     <td> 
      Job: <select data-bind="options: UserJobs, optionsText: 'Value', value: selectedJob"></select> 
     </td> 
     <td> 
      Service: <select data-bind="options: UserWorkTypes, optionsText: 'Value', value: selectedWorkType"></select> 
     </td> 
     <td> 
      <button data-bind="click: addProjectWorkedOn">Add Project</button> 
     </td> 
    </tr> 
</table> 

и это то, что показывает их:

<table> 
    <tr> 
     <td>Client</td> 
     <td>Project</td> 
     <td>Job</td> 
     <td>Service</td> 
     <td></td> 
    </tr> 
    <tbody data-bind="foreach: ListProjectsWorkedOn()"> 
     <tr> 
      <td data-bind="text: client.Value"></td> 
      <td data-bind="text: project.Value"></td> 
      <td data-bind="text: job.Value"></td> 
      <td data-bind="text: workType.Value"></td> 
      <td><button data-bind="click: $parent.removeProjectWorkedOn">Remove</button></td> 
     </tr> 
    </tbody> 
</table> 

Заранее благодарен!

EDIT:

Я работал его

добавить проект установки атрибутов, как это: project.clientValue (. Self.selectedClient() Value);

затем ссылаться на них с точки зрения называть его как функцию: clientValue()

Заслуга Прэтт для объяснения, что наблюдаемые следует называть как функции, если вы хотите, чтобы получить их значение

Answer 1

Потому что вы 'установить значения ProjectWorkedOn наблюдаемых и получить выбранные значения неправильно. Чтобы установить наблюдаемое, вы передаете значение как параметр, как для функции, и чтобы получить значение наблюдаемого, вы называете его как функцию. (Они на самом деле являются функциями.):

self.addProjectWorkedOn = function() { 
    var project = new ProjectWorkedOn(); 
    project.client(self.selectedClient()); 
    project.job(self.selectedJob()); 
    project.project(self.selectedProject()); 
    project.workType(self.selectedWorkType()); 
    self.ListProjectsWorkedOn.push(project) 
} 

EDIT

Я думал, вы в буквальном смысле хотел выбранные значения, а не фактический весь объект JSON. То, что вы пытаетесь просто, невозможно. Значение select должно быть целым числом или строкой - оно не может быть полным объектом. Обычно вы обрабатываете что-то вроде этого, сначала просто возвращая список значений/текста, чтобы заполнить выборки, где значение будет чем-то вроде идентификатора. Затем, после выбора, вы должны выдать запрос AJAX для извлечения объекта с этим идентификатором.