Knockout dynamically updating observableArray values

Question

I have the following structure in my knockout app:

• A computed value which is the sum of two observables (comp1)
• An observableArray (blank by default)
• A set of data that is pushed into the observableArray via a separate viewModel function

My problem lies with the fact that when the computed observable (comp1) is pushed into the array, the value of it doesn't change when it's displayed in the table (via the separate viewModel function) when it's updated in the main view.

I have setup a codepen to explain to the problem a little better and to make it a little bit clearer to understand as I really don't think I've explained the problem very well and it's a bit complicated to explain just via text!

In short: The value of (comp1) isn't updated inside the table (that's generated from an observableArray) when it's updated in the main view.

If there's anything you're unsure of then please ask, but I think everything should be a lot clearer once you view the Codepen.

http://codepen.io/anon/pen/nwgGB

Answer 1

Because you're passing the unwrapped value of maths_total (self.maths_total()). This way tableView does not know when that value changes. Instead, you should pass the actual observable:

self.table_totals.push(new tableView('column 1', 15, self.maths_total, 45));

And then check the variable inside tableView

self.val_2 = ko.isObservable(val2) ? val2 : ko.observable(val2)

http://codepen.io/anon/pen/qFsgu