从 Twig 中的数组键中删除“ ”括号

Question

Twig 使我的数组键格式不正确，并向从 symfony2 控制器传递的数组键添加了“”括号。

该数组被传递到一个 Javascript 图形库，它需要：

[{x:"disabled test object",y:"17",label:"disabled test object"}]

相反， {{ array|json_encode|raw }}正如 Twig 文档和我读过的其他 SO 问题所建议的那样返回不可读的：

[{"x":"disabled test object","y":"17","label":"disabled test object"}]

我认为这应该不难实现，但到目前为止通过 json_encode 选项还没有得出明确的答案。 我不确定是否可以从 PHP 中执行某些操作，因此我现在添加了该标记。

编辑：

我现在正在尝试使用 Twig 手动遍历数组。 {{dump(points)}}确认它被正确填充

{% set points = chart.dataPoints|json_encode|raw %} <=== this was the problem
dataPoints:
     {% for point in points %}
         {{ dump(point) }}
         { x: {{ point.x }}, y: {{ point.y }}, label: {{ point.label }} }
         {% if loop.lastIndex != true %}
             ,
         {% endif %}
     {% endfor %}

但这也不起作用，因为从未到达转储。 这是尝试通过 Twig 访问foreach对象的正确方法吗？ 此代码是几个 Twig 文档教程的合并。

编辑2，解决方案：

行{% set points = chart.dataPoints|json_encode|raw %}将整个数组变成了单个字符串，使 javascript 无法解释为数组。 删除它之后，剩下的就是确保查询结果具有正确的数组键并在将其传递给 Twig 之前转换 X 轴数据。

$i = 0;
$points = array();
/** @var array $query_result*/
foreach($query_result as &$row) {
  foreach($row as $value) {
   $point[] = [
    'x'  => ($i)*10,
    'y' => $value['y'],
    'label' => $value['label']
   ];
   $points[$i] = $point;
   $i++;
  }
}

Answer 1

看起来第一个是 JavaScript 对象，第二个是 JSON，尝试像这样在字符串上运行 JSON.parse 以将其转换回对象：

var fixed = JSON.parse('[{"x":"disabled test object","y":"17","label":"disabled test object"}]');

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/JSON/parse

Answer 2

引号对 CanvasJS 来说不是问题。 正如你在下面的例子中看到的， "x":有效（我拿了这个例子）：

 window.onload = function () { var chart = new CanvasJS.Chart("chartContainer", { title:{ text: "Top Oil Reserves" }, data: [{ dataPoints: [ { x: 1, y: 297571, label: "Venezuela"}, { "x": 2, "y": 267017, label: "Saudi" } ] }] }); chart.render(); }

 <!DOCTYPE HTML> <html> <head> <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/canvasjs/1.7.0/canvasjs.min.js"></script> </head> <body> <div id="chartContainer" style="height: 200px; width: 100%;"></div> </body> </html>

所以我们需要为dataPoints:提供一个 JSON 数组dataPoints:

在 Controller 的函数中定义 PHP 数组并将其传递给模板：

public function myAction()
{
    // …

    $json = array(
        array(
            'x' => 1,
            'y' => 297571,
            'label' => 'Venezuela',
        ),
        array(
            'x' => 2,
            'y' => 267017,
            'label' => 'Saudi',
        ),
    );

    return array(
        // …
        'json' => $json,
    );
}

在模板中显示数组并将其传递给dataPoints ：

<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/canvasjs/1.7.0/canvasjs.min.js"></script>
<script>
    var json = {{ json|json_encode|raw }};
    window.onload = function () {
        var chart = new CanvasJS.Chart("chartContainer",
        {
            title:{
                text: "Top Oil Reserves"
            },
            data: [{
                dataPoints: json
            }]
        });

        chart.render();
    }
</script>
<div id="chartContainer" style="height: 300px; width: 100%;"></div>

渲染的输出将是：

// …
<script>
    var json = [{"x":1,"y":297571,"label":"Venezuela"},{"x":2,"y":267017,"label":"Saudi"}];
// …

CanvasJS 将能够读取这个 JavaScript 数组并显示图表。

从 Twig 中的数组键中删除“ ”括号

问题描述

2 个解决方案

解决方案1
1 2016-04-20 14:26:09

解决方案2
1 已采纳 2016-04-22 23:11:21

从 Twig 中的数组键中删除“ ”括号

问题描述

2 个解决方案

解决方案1 1 2016-04-20 14:26:09

解决方案2 1 已采纳 2016-04-22 23:11:21

解决方案1
1 2016-04-20 14:26:09

解决方案2
1 已采纳 2016-04-22 23:11:21