在 Razor 视图中使用 Jquery

Question

我遇到了一个问题，我需要在 Razor 视图中插入一个 jquery 变量。例如我有以下代码：

$(document).ready(function () {
        var options = {
            pages: @Html.Raw(Json.Encode(ViewBag.Array)) ,
            singlePageMode: true
        };
        $("#pdfbox").flipBook(options);
    })

给出输出：

$(document).ready(function () {
        var options = {
            pages: ["http://localhost:651684/Document/GetPage?PageID=71184505-1.png","http://localhost:65184/Document/GetPage?PageID=71184505-2.png"] ,
            singlePageMode: true
        };
        $("#pdfbox").flipBook(options);
    })

要使其正常工作，我必须像这样在页面数组中添加“{src:}”：

pages:[
{src:"http://localhost:651684/Document/GetPage?PageID=71184505-1.png"},        
{src:"http://localhost:651684/Document/GetPage?PageID=71184505-1.png"}
]

但我似乎做不到。有没有办法在@Html.Raw(Json.Encode(ViewBag.Array))中插入jquery。请需要帮助。

谢谢。

Answer 1

使用Array#map()到return需要的对象数组

    var options = {
        pages: @Html.Raw(Json.Encode(ViewBag.Array)) ,
        singlePageMode: true
    };

    options.pages = options.pages.map(function(url){
       return { src: url };
    });

    $("#pdfbox").flipBook(options);

Answer 2

这是一个在线解决方案

$(document).ready(function () {
    var options = {
        pages: @Html.Raw(Json.Encode(ViewBag.Array) + ".map((u)=>{return {src: u };})") ,
        singlePageMode: true
    };
    $("#pdfbox").flipBook(options);
})

变成

$(document).ready(function () {
    var options = {
        pages: ["http://www.google.com","http://www.whosebug.com"].map((u)=>{return {src: u };}) ,
        singlePageMode: true
    };
    $("#pdfbox").flipBook(options);
})

在 Razor 视图中使用 Jquery

Using Jquery in Razor View

.net

jquery

visual-studio

razor-pages