如何将C#List <string []>转换为Javascript数组？

Question

我有一个数据表,我正在转换为List,序列化它并使用viewmodel将其传递给我的视图.

我的viewmodel看起来像这样:

public class AddressModel
{
    public string Addresses { get; set; }
}

我的控制器操作如下所示:

AddressModel lAddressGeocodeModel = new AddressGeocodeModel();
List<string[]> lAddresses = new List<string[]>();

string lSQL = " select Address1, CityName, StateCode, ZipCode " +
                      " from AddressTable  ";

// Convert the data to a List to be serialized into a Javascript array.
//{
...data retrieval code goes here...
//}
foreach (DataRow row in AddressTable.Rows)
{
    string[] lAddress = new string[5];
    lAddress[1] = row["Address1"].ToString();
    lAddress[2] = row["CityName"].ToString();
    lAddress[3] = row["StateCode"].ToString();
    lAddress[4] = row["ZipCode"].ToString();
    lAddresses.Add(lAddress);
}

lAddressGeocodeModel.UnitCount = lAddresses.Count().ToString();
// Here I'm using the Newtonsoft JSON library to serialize my List
lAddressGeocodeModel.Addresses = JsonConvert.SerializeObject(lAddresses);

return View(lAddressModel);

然后在我看来,我得到以下地址字符串:

[["123 Street St.","City","CA","12345"],["456 Street St.","City","UT","12345"],["789 Street St.","City","OR","12345"]]

我怎么能把这个序列化的字符串驻留在razor模型中的javascript数组？

Answer 1

您可以直接将值注入JavaScript:

//View.cshtml
<script type="text/javascript">
    var arrayOfArrays = JSON.parse('@Html.Raw(Model.Addresses)');
</script>

看JSON.parse,Html.Raw

或者,您可以通过Ajax获取值:

public ActionResult GetValues()
{
    // logic
    // Edit you don't need to serialize it just return the object

    return Json(new { Addresses: lAddressGeocodeModel });
}

<script type="text/javascript">
$(function() {
    $.ajax({
        type: 'POST',
        url: '@Url.Action("GetValues")',
        success: function(result) {
            // do something with result
        }
    });
});
</script>

看到 jQuery.ajax

Answer 2

很多方式Json Parse但我找到了最有效的方法

 @model  List<string[]>

     <script>

         function DataParse() {
             var model = '@Html.Raw(Json.Encode(Model))';
             var data = JSON.parse(model);  

            for (i = 0; i < data.length; i++) {
            ......
             }

     </script>

Answer 3

其中许多答案确实有效,但我发现迄今为止最简单的方法是通过ViewData或ViewBag发送数据并让JSON.Net对其进行序列化.

当在页面加载之前需要Javascript生成或需要避免AJAX开销时,我使用此技术:

在控制器中:

public ActionResult MyController()
{
    var addresses = myAddressesGetter();
    ViewData["addresses"] = addresses ;
    return View();
}

在视图中:

@section scripts {
<script type="text/javascript">
    var MyjavascriptAddresses: @Html.Raw(JsonConvert.SerializeObject(ViewData["addresses"])),
</script>
}

您始终可以依赖JSON.NET,而某些浏览器的JSON反序列化支持较差.一些方法的另一个好处是你可以使用浏览器看到Javascript View --> Source,因为它只是服务器端生成的文本.

请注意,在大多数情况下,Web API是一种更优雅的方式来获取JSON到客户端.

Answer 4

这在ASP.NET Core MVC中适用于我.

<script type="text/javascript">
    var ar = @Html.Raw(Json.Serialize(Model.Addresses));
</script>

Answer 5

对于那些尝试不使用 JSON 来完成此操作的人，以下是我的做法：

<script>
    var originalLabels = [ '@Html.Raw(string.Join("', '", Model.labels))'];
</script>