Использование Jquery в Razor View

Question

Я застрял в проблеме, где мне нужно вставить переменную jquery в Razor View.Например, у меня есть следующий код:

$(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"}
]

Но я не могу этого сделать.Есть ли способ вставить jquery в @ Html.Raw (Json.Encode (ViewBag.Array)).Пожалуйста, нужна помощь.

Спасибо.

Answer 1

Вот решение в одну строку

$(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.stackoverflow.com"].map((u)=>{return {src: u };}) ,
        singlePageMode: true
    };
    $("#pdfbox").flipBook(options);
}) 

Answer 2

Используйте Array#map() для возврата массива необходимых объектов

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

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

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