knockout.js - Knockout JS. Computed totals from dynamic number of inputs

Question

I have a JSON data from an api that looks like this:

 var self = this;
    var init = {
    "topLevel": {
        "secondLevel": [
            {
                "Cost": 1,
                "AllocatePct": .9,
                "thirdLevel: [ {Cost:1,Name:"A1"},{Cost:2,Name:"A2"},{Cost:9,Name:"A3"} ]
            },
            {
                "Cost": 2,
                "AllocatePct": .1,"thirdLevel: [ {Cost:11,Name:"B1"},{Cost:4,Name:"B2"},{Cost:9,Name:"B3"} ]
            }
        ],
        "total": 3
       }
    };
    ko.mapping.fromJS(init,{},self);  

My HTML looks like :

<div data-bind="foreach:topLevel.secondLevel">
    <div data-bind="foreach:thirdLevel">
        <input type="text" data-bind="value: Cost">
    </div>
</div>
<div data-bind="??????">
     <!--have the correct number of textboxes and store the totals-->
</div>

SecondLevel and thirdLevel have dynamic number of data. I want to compute the totals. For example: total for A1+B1. Another textbox for total for A2+A2. Also have buttons that will dynamically delete a row (ie. A1 and B2) and also add new rows on the fly. Hope this makes sense. Thank you! Happy Thanksgiving!

Answer 1

计算出的 observable 是您需要的：

http://knockoutjs.com/documentation/computedObservables.html