javascript - ASP MVC 将数组对象发送到 JavaScript 函数

Question

我在大学类(class)中使用 ASP MVC。但是我遇到了一个问题，在我发送太多 AJAX 请求之前导致我的页面加载时间太长。因此我认为我可以通过将数组从数据库发送到 View 然后将它们放入我的 jquery 函数内联来改善这种情况。

下面是我的简单模型的样子:

public class NewBooking
    {
        public IEnumerable<dynamic> parks { get; set; }
    }

然后在我的 Controller 中，我使用数据库中的信息设置公园，如您所见:

public ActionResult Index()
        {
            var model = new NewBooking();

            var parks = Database.Open("SQLServerConnectionString").Query("SELECT * FROM Park");

            var output = from o in parks
                         select new { parkID = o.parkID, parkName = o.parkName };
            model.parks = output.ToList();

            return View(model);
        }

现在，这将返回到 View 中我期望的所有信息，如果我只是在 View 中调用模型公园，您可以在下面看到:

@model build_01.Models.Timetabler.NewBooking
@{
    @Model.parks
}

我知道这种方法不会，但是对于 for 循环它工作正常，现在是我的问题；我正在尝试调用一个 JavaScript 函数并将这个数组传递给它。

$(document.ready(function () {
        slotAvailability(@Model.parks);
    }));

我可以对这个 @Model.parks 做些什么以便能够将它发送到函数吗？有点像如果我使用 AJAX，我会如何处理 JSON。

就目前而言，尝试这样调用它会在我的控制台中出现此错误:

Uncaught SyntaxError: Unexpected number

我明白为什么，如果我要检查元素，我可以看到函数解析看起来像这样:

slotAvailability(System.Collections.Generic.List`1[<>f__AnonymousType3`2[System.Object,System.Object]]);

谢谢

Answer 1

您应该使用 Json.Encode 函数。还要确保在 document 之后的正确位置关闭括号:

$(document).ready(function () {
    var parks = @Html.Raw(Json.Encode(Model.parks));
    slotAvailability(parks);
});

在这里使用 dynamic 似乎也是一个糟糕的设计。你没有任何智能感知。你宁愿有一个 View 模型:

public class ParkViewModel
{
    public int ParkId { get; set; }
    public int ParkName { get; set; }
}

然后是您的 NewBooking 模型:

public class NewBooking
{
    public IEnumerable<ParkViewModel> Parks { get; set; }
}