使用 Javascript 访问通过 Twig 传递的变量

Posted 2023-02-16

【中文标题】使用 Javascript 访问通过 Twig 传递的变量

【英文标题】：Use Javascript to access a variable passed through Twig

【发布时间】：2012-12-05 09:48:46

【问题描述】：

我有一个控制器，它将一个数组传递给一个树枝模板，我想在该页面上编写的脚本中使用它。我该怎么做呢？

我已经在我的 .twig 模板中尝试过这个：

<script>
    $(document).ready(function()
        var test =  testArray ;
);
</script>

但只有当它是一个字符串时才有效。

【问题讨论】：

将当前输出和预期输出添加到您的问题中可以更轻松地找到问题的解决方案。

【参考方案1】：

您可能需要json_encode 数组，试试这个：

<script>
    $(document).ready(function()
        var test =  testArray|json_encode|raw ;
    );
</script>

【讨论】：

有什么建议可以对对象数组做同样的事情吗？

别忘了加引号var test = ' testArray|json_encode|raw ';

不，你不想引用它。这将使变量成为一个包含 json 值的字符串。如果没有引号，它会被正确解析为数组对象。

我遇到了这个问题，与传单库一起使用时键顺序被颠倒了

【参考方案2】：

首先，发送从控制器编码的数据json和

然后在javascript中，

var context= JSON.parse(' YourArrayFromController|raw');

【讨论】：

@JoséGabrielGonzález 你会怎么做？

嗯，如果您的 JSON 中的某些值有单引号怎么办？喜欢"message": "Can't process"

【参考方案3】：

在我的控制器中我安装了 SerializerBundle

$serializer = $this->get('serializer');
        $countries = $this->getDoctrine()->getRepository("QSCORBundle:CountryMaps")->findAll();
        $jsonCountries = $serializer->serialize($countries, 'json');
 return $this->render('QSCORBundle:Default:index.html.twig',array("countries"=> $jsonCountries));

在我的文件树枝中

<script type="text/javascript" >
 var obj =  countries|json_encode|raw ;
 var myObject = eval('(' + obj + ')');

 console.log(myObject[0]['capital_latitude'] + " " + myObject[0]['capital_longitude']);//for the First Element
</script>

【参考方案4】：

我是这样做的：

然后返回控制器test.data

$test = array('data' => array('one','two'))

树枝：

<div id="test" data-is-test=" test.data|json_encode "></div>

Js：

$(document).ready(function() 
    var test = $('#test').data("isTest");
    console.log(test);
);

输出：

 ["one", "two"]

documentation here