2

まず第一に、達成する必要がある結果を正確に表す JSFiddle があり、それは機能します: http://jsfiddle.net/etiennenoel/wG9SZ/

ただし、このコード構造を、既に複数のバインディングを持つより大きなプロジェクトに統合する必要があるため、以前の JSFiddle のように配列にバインドすることしかできません。

したがって、JSON オブジェクトをマップする必要がありますが、このオブジェクトは関数またはビューモデル内にある必要があります。

通常、私のhtmlは同じか近いはずです。

これが私がやろうとしていることの私のjsコードです:

function appViewModel() {
    var self = this;
    self.formData = ko.observableArray();
    self.formData.push({"data": 
        [
            {
            "groupName" : "Properties",
            "content" : 
            [
                {
                    "title" : "Calculation Method",
                    "formType" : "select",
                    "selected" : "2",
                    "value" : 
                    [
                        {
                            "title" : "Voltage Drop - Unbalanced",
                            "value" : "1"
                        },
                        {
                            "title" : "Voltage Drop - Balanced",
                            "value" : "2"
                        }
                    ]
                },

                {
                    "title" : "Tolerance (% V)",
                    "formType" : "textBox",
                    "value" : 0.01
                },

                {
                    "title" : "Calculation Options",
                    "formType" : "checkbox",
                    "value" : 
                    [ 
                        {
                            "title" : "Flat Start (at Nominal Conditions",
                            "checked" : false
                        } ,
                        {
                            "title" : "Assume Line Transposition",
                            "checked" : true
                        }
                    ]
                },

                {
                    "title" : "Adjust Conductor Resistance at",
                    "formType" : "textBox",
                    "disabled" : true,
                    "value" : 77,
                    "appendLabel" : true,
                    "appendLabelText" : "°F"    
                }
            ]
            },
            {
            "groupName" : "Properties",
            "content" : 
            [
                {
                    "title" : "Calculation Method",
                    "formType" : "select",
                    "value" : 
                    [
                        {
                            "title" : "Voltage Drop - Unbalanced",
                            "selected" : false

                        },
                        {
                            "title" : "Voltage Drop - Balanced",
                            "selected" : true
                        }
                    ]
                },

                {
                    "title" : "Tolerance (% V)",
                    "formType" : "textBox",
                    "value" : 0.01
                },

                {
                    "title" : "Calculation Options",
                    "formType" : "checkbox",
                    "value" : 
                    [ 
                        {
                            "title" : "Flat Start (at Nominal Conditions",
                            "checked" : false
                        } ,
                        {
                            "title" : "Assume Line Transposition",
                            "checked" : true
                        }
                    ]
                },

                {
                    "title" : "Adjust Conductor Resistance at",
                    "formType" : "textBox",
                    "disabled" : true,
                    "value" : 77,
                    "appendLabel" : true,
                    "appendLabelText" : "°F"    
                }
            ]
            }
        ]
    });  
}

var viewModel = new appViewModel()

ko.mapping.fromJS(viewModel.formData)
ko.applyBindings(viewModel);

このコードは、http: //jsfiddle.net/etiennenoel/wG9SZ/23/でも入手できます。

今、それはうまくいかず、その理由はわかりません。私は本当にformData関数の中にいる必要があります。問題は、ドキュメントがそのようなことについて話していないことです...

それを行う方法はありますか?

そうでない場合、ノックアウトを関数と変数に同時にバインドする方法はありますか?

4

1 に答える 1