将KnockoutJS的数据绑定拆分为表C#

对于KnockOutJS中的输入标记，我有一个带有data bind=“value:contents”的标记

<input type="text" class="form-control" data-bind="value: contents" />

它以以下格式显示{“key1”：“value1”，“key2”：“value2”}

我正在构建一个包含名称和值的表，然后分别拆分这些键和值，并显示在TDs中

<td>
    <strong>
         <span id="textKey" data-bind="text: displayKey" />    
    </strong>
</td>

<td>
         <input id="textValue" type="text" data-bind="value: displayValue" />
</td>

在我的例子中，您能帮助我了解如何将这些键和值拆分为字典和列和行吗

---

谢谢

如果要使用Knockout填充HTML表，可以使用带有

foreach

数据绑定的

observatarray

。有关使用以下代码的工作，请参见此处：

查看模型：

var vm = {
    contents: ko.observableArray([{
        "displayKey": "Fruit",
        "displayValue": "Bananas"
    }, {
        "displayKey": "Colour",
        "displayValue": "Red"
    }, {
        "displayKey": "Car",
        "displayValue": "Ferrari"
    }])
};
ko.applyBindings(vm, document.body);

<textarea style="width: 500px; height: 90px;"
data-bind="value: JSON.stringify(ko.toJS(contents()))"></textarea>

<table>
    <tbody data-bind="foreach: contents">
        <td> <strong>
                 <span id="textKey" data-bind="text: displayKey" />    
            </strong>
        </td>
        <td>
            <input id="textValue" type="text" data-bind="value: displayValue" />
        </td>
    </tbody>
</table>

HTML:

var vm = {
    contents: ko.observableArray([{
        "displayKey": "Fruit",
        "displayValue": "Bananas"
    }, {
        "displayKey": "Colour",
        "displayValue": "Red"
    }, {
        "displayKey": "Car",
        "displayValue": "Ferrari"
    }])
};
ko.applyBindings(vm, document.body);

<textarea style="width: 500px; height: 90px;"
data-bind="value: JSON.stringify(ko.toJS(contents()))"></textarea>

<table>
    <tbody data-bind="foreach: contents">
        <td> <strong>
                 <span id="textKey" data-bind="text: displayKey" />    
            </strong>
        </td>
        <td>
            <input id="textValue" type="text" data-bind="value: displayValue" />
        </td>
    </tbody>
</table>

如果您无法控制

内容的结构

，您可以使用在上一个线程中创建的数组转换，如下所示：

Html

---

要转换成字典，你可以检查这个线程Hi@Gôifact，在你之前的帖子中又是我，非常感谢你的帮助，但现在我面临一件事，键和值的数据不是来自JS中的预定义值，而是来自输入标记的数据绑定，我没有权利修改数据绑定中的“内容”，所以现在我想知道是否可以将mapDictionaryToArray（内容）正确地放在cshtml输入标记中？谢谢，它工作得很好，不幸的是，在我的情况下，键有时没有固定，因为我再次检查，它们与我有时使用的数据不一样：“{\“reference\”：\”8542\，\“rion\u id\：\“9861\”}“所以在表中，我无法修复displayKey，我想谢谢GoTo，我已将js拆分为多个文件：如本例所示，但我仍然无法从转换后的字典中获取数据，您能在此处查看这些文件吗：谢谢