如何在视图中使用键值对结构

Question

如何在 javascript 中使用 KeyValue 对（存储在 ViewBag/ViewData 中）。我需要一个 KeyValue 对结构，比如一个来自控制器的字典，以便在视图中使用。

ViewBag.ContactTypes = new Dictionary<string,string>
                {
                    {"Home", "5"},
                    {"Cell", "6"},
                    {"Work", "7"},
                    {"Fax", "8"},
                    {"Other", "9"},
                };

& 我想通过如下键访问这些字典值：

ViewBag.ContactTypes["Home"]

如何实现这个目标，有什么想法吗？

Answer 1

这只是一个想法，如果没有用我会删除它。

在您的控制器中，我将使用 JsonSerializer（选择您最喜欢的一个），并将 Json 对象保存到 viewBad 中：

 ViewBag.ContactTypes = YourJsonConverter.serialize(new Dictionnary<string, string>{[...]});

然后，将其用作视图内的字符串：

 <script type="text/javascript">
     var myJson = @Viewbag.ContactTypes
 </script>

Answer 2

在您的视图中尝试此代码

首先，将您的字典代码包装成 JSON：

ViewBag.ContactTypes = Json(new Dictionary<string,string>
                {
                    {"Home", "5"},
                    {"Cell", "6"},
                    {"Work", "7"},
                    {"Fax", "8"},
                    {"Other", "9"},
                });

在您的 cshtml 文件中使用下面的 javascript。

<script type="text/javascript" >
                var data = JSON.stringify(@Html.Raw(Json.Encode(ViewBag.ContactTypes)));
                data = JSON.parse(data);
                alert(data.Data.Home);
</script>

查看fiddle

工作小提琴图像

建议

如果这些值是固定的，那么我建议不要从服务器获取它，而是在 javascript 文件中使用 Enums。 取而代之的是这些 {"家", "5"}, {"单元格", "6"}, {"工作", "7"}, {"传真", "8"}, {"其他", "9"},

在你的 Common.JS 文件中创建枚举

var myApp = myApp || {};
myApp.Enums = function () {
    ContactTypes = {
        Home: 5,
        Cell: 6,
        Work: 7,
        Fax: 8,
        Other: 9,
    };
    Status = {
        CREATED: "CREATED",
        INPROGRESS: "In Progress",
        Completed: { value: 3, name: "Completed", text: "Status Completed" }
    };
    return { Status: Status, ContactTypes: ContactTypes}
}();

用法

alert(myApp.Enums.ContactTypes.Home);

为了获得更好的智能，只需将您的 common.js 拖到您的事务 JS 文件中。