Question

我坚持认为非常基本的东西，因此我需要一些专业知识来帮助我完成这项任务。

我有一个字典，它将整数和字符串作为值来存储结果列表（我将在下面显示）。我的视图模型和控制器有这个代码，它将数据作为JSON字符串发布到Knockout：

[ViewModel代码]

public class ResultModel
{
    public Dictionary<int, string> dictResult { get; set; }
    public string dictResultJson { get; set; }

    public ResultModel()
    {
        dictResult = new Dictionary<int, string>();
    }
}

[cshtml文件代码]

<h2>Results</h2>
<table>
    <tbody data-bind="template: { name: 'tblResult', foreach: dictResultJson() }"></tbody>
</table>

<script id="tblResult" type="text/html">
    <tr>
        <td data-bind="value: key"></td>
        <td data-bind="value: value"></td>
    </tr>
</script>

<script type="text/javascript">
    var ResultModel = function(m) {
        var self = this;
        self.dictResultJson = ko.observableArray(mapDictionaryToArray(m.DictJson));
    };

    function mapDictionaryToArray(dictionary) {
        var result = [];
        for (var key in dictionary) {
            if (dictionary.hasOwnProperty(key)) {
                result.push({ key: key, value: dictionary[key] }); 
            }  
        }

        return result;
    }

    var data = @(Html.Raw(Json.Encode(Model)));
    var dataFromServer = ko.utils.parseJson(data.dictResultJson);
    console.log(dataFromServer);  

    ko.applyBindings(new ResultModel(dataFromServer));
    console.log("apply binding");
</script>

在我的cshtml文件中，我正在从MVC控制器解析返回的对象并将其转换为数组。现在的问题是它没有显示任何数据，但变量dataFromServer包含适当的数据。它有这些数据：

对象{1：＆＃34; Kate＆＃34;，3：＆＃34; Alex＆＃34;，4：＆＃34; Jane＆＃34;}

现在，我应该如何循环这个json Result以便以表格格式显示它，例如

表

1凯特

3 Alex

4简

提前致谢

杰斯蒙

Answer 1

如果您想要将表格中的值显示为文字，则需要使用text binding代替value

<tr>
    <td data-bind="text: key"></td>
    <td data-bind="text: value"></td>
</tr>

您的代码还有另外一个问题。当您致电new ResultModel(dataFromServer)时，dataFromServer已包含正确格式的数据。因此，m.DictJson函数中不需要ResultModel：

var ResultModel = function(m) {
        var self = this;
        self.dictResultJson = ko.observableArray(mapDictionaryToArray(m));
};

Knockout Js字典显示MVC

1 个答案: