问在页面加载时执行的Knockout计算

EN

<div>
  <select id="selectmenu1" data-bind="options: departments, 
             optionsValue: 'id', 
             optionsText: 'name', 
             optionsCaption: 'Choose...',value: selectedDept">
  </select>
  <select id="selectmenu1" data-bind="options: contacts, 
             optionsValue: 'id', 
             optionsText: 'name', 
             optionsCaption: 'Choose...'">
  </select>
</div>

// Here's my data model
var ViewModel = function(first, last) {
  var self = this;
  var deptArray = [];
  var deptObj = {
    id: "8888",
    name: "Electrical"
  };
  deptArray[0] = deptObj;
  deptObj = {
    id: "9999",
    name: "Admin"
  };
  deptArray[1] = deptObj;
  self.departments = ko.observableArray(deptArray);
  self.selectedDept = ko.observable();
  self.contacts = ko.observableArray();
  self.contactsRetrieve = ko.computed(function() {
    var deptId = self.selectedDept();
    console.log("entered");
    $.ajax({
      url: '/echo/js',
      complete: function(response) {
        console.log("success");
        var contactArray = [];
        var contactObj = {};
        if (deptId == '8888') {
          contactObj.id = '1234';
          contactObj.name = 'Vivek';
        } else if (deptId == '9999') {
          contactObj.id = '5678';
          contactObj.name = 'Sree';
        }
        contactArray[0] = contactObj;
        self.contacts(contactArray);
      }
    });
    console.log("exited");
  });
};

ko.applyBindings(new ViewModel());