javascript - 反序列化Json字典obj以显示多个值

Question

我有一个带有模式弹出窗口的 View ，它显示“参数”，或者更确切地说，来自传递到前端的字典的数据。使用我当前的 JS，我的函数似乎一次只会反序列化一个键和值。但是，如果字典传入多个键和值，我需要编辑该函数，以便它可以反序列化多个键和值。

下面是我的代码。如果您想了解更多有关后端的信息，请告诉我。

Controller 正在返回:

var parameters = new Dictionary<string, string>();

return Json(parameters, JsonRequestBehavior.AllowGet);

重申一下，参数是一个字典，可以有一个键/值，也可以包含多个键/值对。

JS:

   $("button[name='paramsBtn']").click(function () {
    /* Grabs ID from col selected */
    var $col = $(this).closest('.row').find('.requestId');
    var jobRequestId = $col.data('id');

     $.ajax({
        url: '@Url.Action("JobPollerParameters", "Tools")',
         data: { "jobRequestId": jobRequestId},
         success: function (results) {

            $modal = $('#paramsModal');
            $modal.modal("show");

             var arr = results;
             //loop through arr created from dictionary to grab key(s)
             for (var key in arr) {
                 if (arr.hasOwnProperty(key)) {
                     var myKey = key;
                 }
             }

             var name = myKey;
             var value = results[myKey];

            $('#modalName').text(name);
             $('#modalMessage').text(value);
        }
    });
});

这里是模态:

<div class="modal fade" id="paramsModal" tabindex="-1" role="dialog">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header modal-header-primary">
                <a class="btn btn-xs btn-primary pull-right" data-dismiss="modal" aria-label="Close"><span class="glyphicon glyphicon-remove"></span></a>
                <h4 class="modal-title" id="modalTitleText">Job Parameters</h4>
            </div>
            <div class="modal-body">
                <div class="list-group">
                    <div class="row list-group-item list-group-item-heading container divTableHeading" style="width:inherit; margin-bottom:0px;">
                        <div class="col-md-6 font-weight-bold"> Parameter: </div>
                        <div class="col-md-6 font-weight-bold"> Value: </div>
                    </div>

                    <div class="row list-group-item container" style="width:inherit;">
                        <div class="col-md-6 text-break" id="modalName"></div>
                        <div class="col-md-6 text-break" id="modalMessage"></div>
                    </div>
                </div>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-primary" data-dismiss="modal">Close</button>
            </div>
        </div>
    </div>
</div>

Answer 1

这一行令人困惑:

var myKey = key;

循环完成后，myKey将等于数组中最后一个索引，因此 2如果results长度为 3。

所以，name将等于 2和value将等于 results 中的最后一个元素

也许您正在寻找类似的东西，因为 results是{字符串，字符串}:

// sample results array from server
var arr = ["val1", "val2", "val3"];
var displayString = "";
for (var key in arr) {
  if (arr.hasOwnProperty(key)) {
    displayString += arr[key] + ","; // note, there will be a trailing comma
  }
}
console.log(displayString);