在 Laravel 中将 JSON 传递给 Javascript – 但 JS 正在将 JSON 转换为 HTML 实体

Question

在我的 Laravel 控制器中，我正在创建一个多维关联数组：

$trendChart = Array (
    "series" => Array (
        "data" => Array(1, 1, 2, 2, 3, 3, 3, 3, 4, 4, 4, 5)
    ),
    "xaxis" => Array (
        "categories" => Array ("Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"),
    ),
    "chart" => Array (
        "type" => "line",
        "height" => 350,
    ),
    "stroke" => Array (
        "curve" => "smooth",
    ),
    "dataLabels" => Array (
        "enabled" => false,
    ),
    "fill" => Array (
        "colors" => Array ("#006ba6", "#f23f2b", "#f3f3f3")
    ),
    "annotations" => Array (
        "yaxis" => Array (
            "y" => 4.8,
            "borderColor" => "rgba(155, 199, 0, 1)",
            "borderWidth" => 3,
            "label" => Array(
                "borderColor" => "rgba(155, 199, 0, 1)",
                "style" => Array(
                    "color" => "#fff",
                    "background" => "rgba(155, 199, 0, 1)",
                ),
                "text" => "Ideal Average",
            ),
        ),
    ),
);

然后我将其编码为 JSON，其中：

$defaultChartOptions = json_encode($trendChart);

然后我将 $defaultChartOptions 传递到我的视图中：

return view('myview')->with(['defaultChartOptions' => $defaultChartOptions]);

在我看来，我有以下JS：

var chartOptions = JSON.parse({{$defaultChartOptions}});

郑重声明，我也尝试过不使用 JSON.parse 命令。无论哪种方式，当它传递给 JS 时，所有引号都已转换为 HTML 实体。查看页面源码，是这样的：

var chartOptions = {&quot;series&quot;:{&quot;data&quot;:[1,1,2,2,3,3,3,3,4,4,4,5]},&quot;xaxis&quot;:{&quot;categories&quot;:[&quot;Jan&quot;,&quot;Feb&quot;,&quot;Mar&quot;,&quot;Apr&quot;,&quot;May&quot;,&quot;Jun&quot;,&quot;Jul&quot;,&quot;Aug&quot;,&quot;Sep&quot;,&quot;Oct&quot;,&quot;Nov&quot;,&quot;Dec&quot;]},&quot;chart&quot;:{&quot;type&quot;:&quot;line&quot;,&quot;height&quot;:350},&quot;stroke&quot;:{&quot;curve&quot;:&quot;smooth&quot;},&quot;dataLabels&quot;:{&quot;enabled&quot;:false},&quot;fill&quot;:{&quot;colors&quot;:[&quot;#006ba6&quot;,&quot;#f23f2b&quot;,&quot;#f3f3f3&quot;]},&quot;annotations&quot;:{&quot;yaxis&quot;:{&quot;y&quot;:3,&quot;borderColor&quot;:&quot;rgba(229, 78, 78, .65)&quot;,&quot;borderWidth&quot;:3,&quot;label&quot;:{&quot;borderColor&quot;:&quot;rgba(229, 78, 78, 1)&quot;,&quot;style&quot;:{&quot;color&quot;:&quot;#fff&quot;,&quot;background&quot;:&quot;rgba(229, 78, 78, 1)&quot;},&quot;text&quot;:&quot;Your Average&quot;}}}}

我在这里错过了什么？

Answer 1

相反，做

var chartOptions = JSON.parse({{$defaultChartOptions}});

做：

这将防止数据被转义

var chartOptions = {!! ($defaultChartOptions) !!};

Answer 2

您只需更改即可获得：

var chartOptions = JSON.parse({{$defaultChartOptions}});

至：

var chartOptions = {!! ($defaultChartOptions) !!};

你的问题就迎刃而解了。

在 Laravel 中将 JSON 传递给 Javascript – 但 JS 正在将 JSON 转换为 HTML 实体

Passing JSON to Javascript in Laravel – but JS is converting the JSON to HTML Entities

javascript

php

json

laravel