ASP.NET MVC 3 Razor:初始化一个JavaScript数组

Question

使用Razor在我的模型/视图模型中使用值初始化ASP.NET MVC 3中的JS数组的首选方法是什么？

例如,初始化表示日期的字符串数组:

<script type="text/javascript">
    var activeDates = ["7-21-2011", "7-22-2011"];
</script>

同

public class MyViewModel
{    
  public DateTime[] ActiveDates { get; set; }
}

Answer 1

我不太了解JS和ASP.NET MVC 3 Razor之间的关系.无论在服务器上使用哪种技术来生成页面,Javascript都在客户端运行.所以在javascript上,数组是一个数组.

在javascript中定义对象数组有几种可能性

var activeDates = [ '7-21-2011', '7-22-2011' ];

要么:

var activeDates = new Array();
activeArrays.push('7-21-2011');
activeArrays.push('7-22-2011');

还是:

var activeDates = new Array();
activeArrays[0] = '7-21-2011';
activeArrays[1] = '7-22-2011';

最后,所有这些代表相同的数组.但它是一个字符串数组,而不是日期.

如果您想拥有一系列日期,请执行以下操作:

var activeDates = [ 
    new Date(2011, 6, 21, 0, 0, 0, 0), 
    new Date(2011, 6, 22, 0, 0, 0, 0) 
];

现在我可以看到你对ASP.NET MVC的问题的唯一关系是你的视图模型上可能有一些数组:

public class MyViewModel
{
    public DateTime[] ActiveDates { get; set; }
}

你想在javascript数组中序列化和操作.在这种情况下,这是语法:

@model MyViewModel
<script type="text/javascript">
    var activeDates = @Html.Raw(Json.Encode(Model.ActiveDates));
</script>

现在,由于DateTime字段在.NET中被JSON序列化的方式,您将在生成的HTML中得到以下结果:

var activeDates = ["\/Date(1309471200000)\/","\/Date(1311199200000)\/"];

如果你想将这个字符串数组转换为实际的javascript日期数组:

var dates = $.map(activeDates, function(date, index) {
    date = date.replace('/Date(', '').replace(')/', '');  
    return new Date(parseInt(date));
});

Answer 2

我昨天碰巧这样做了并提出了这个解决方案(如果你希望它看起来像你在问题中的输出 - 我在jqplot中使用它):

<script type="text/javascript">
    var activeDates = ['@Html.Raw(string.Join("', '", @ActiveDates.Select(f => string.Format("{0:MM-dd-yyyy}", f)).ToArray()))']
</script>