Search code examples
knockout.jsknockout-viewmodel-plugin

How do you properly reference the viewModel in extended methods when using the knockout.viewmodel plugin?


I'm extending the viewModel. I need to implement the addEmployee method so that it properly references the viewModel.

This is what I have thus far:

JSON:

{"Employees":
    [{"FirstName":"James",
      "LastName":"Bond",
      "Addresses":[{"StreetNumber":"MI6","StreetName":"Undisclosed"},
                   {"StreetNumber":"SAS","StreetName":"Undisclosed"}]},
     {"FirstName":"Jason",
      "LastName":"Bourne",
      "Addresses":[{"StreetNumber":"CIA","StreetName":"Undisclosed"},
                   {"StreetNumber":"NSA","StreetName":"Undisclosed"}]}
     ]
}

JavaScript:

$.getJSON("http://localhost:58191/api/employees", function (jsonModel) {

document.getElementById("test").innerText = JSON.stringify(jsonModel);

var options = {
    extend: {
        "{root}": function () {

            var self = this;
            var employees = new Array();

            self.employees = ko.observableArray(employees);
            var arrayTest = [{ "FirstName": "test", "LastName": "test", "Addresses": [{ "StreetNumber": "MI6", "StreetName": "Undisclosed" }, { "StreetNumber": "SAS", "StreetName": "Undisclosed" }] }];

            self.addEmployee = function () {
                self.employees.push(arrayTest);

            }.bind(self);
        }
    }
}

var kovmmappingVM = ko.viewmodel.fromModel(jsonModel, options);    
ko.applyBindings(kovmmappingVM, document.getElementById("POC"));

});

I would appreciate any assistance. Thanks!


Solution

  • Try this:

    var kovmmappingVM = ko.viewmodel.fromModel(jsonModel, options);
    kovmmappingVM.addEmployee = function (empl) {
        kovmmappingVM.Employees.push(empl);
    }
    ko.applyBindings(kovmmappingVM, document.getElementById("POC"));