Dynamicznie dodawanie właściwości do zaobserwowania obiektu

Question

mam ViewModel takiego,

 function viewModel() { 
      this.loadData = function() { 
       this.Items().C = 3; 
      }; 

      this.Items = ko.observable({ A: 1}); 
      this.Items().B = 2; 
     } 

     var vm = new viewModel(); 
     ko.applyBindings(vm); 
     vm.loadData(); 

ja drukowanie wartości takiego,

 <span data-bind="text: $root.Items().A"></span> 
     <span data-bind="text: $root.Items().B"></span> 
     <span data-bind="text: $root.Items().C"></span> 

wypisze wartości A i B, lecz nie DO?

Dzięki.

Answer 1

Ponieważ początkowo C nie jest obserwowalny, wiązanie nie wie, że musi zostać zaktualizowane po wprowadzeniu zmiany.

Aby uczynić go aktualizować, to albo trzeba zresetować Items całości:

this.loadData = function() { 
    var existing = this.Items(); 
    existing.C = 3; 
    this.Items(existing); 
}; 

lub wywołać funkcję valueHasMutated obserwowalnego, aby wymusić żadnych abonentów zaktualizować jak:

this.loadData = function() { 
    this.Items().C = 3; 
    this.Items.valueHasMutated(); 
};