如何在前端js中使用symfony控制器变量 - how to use symfony controller variables in frontend js?

how to use symfony controller variables in frontend js?

本文关键字：symfony 控制器变量前端 js | 更新日期: 2023-09-27

假设我有一个这样的控制器:

public function showAction(Request $request, $id, $context = array())
{
    $url = $this->getPlayUrl($id, $context);
    //some code here}

我想在前端js文件中使用变量$url，像这样:

var html = '<iframe src='''+ url +''' name=''viewerIframe'' id=''viewerIframe'' width=''100%''allowfullscreen webkitallowfullscreen height=''100%'' style=''border:0px''></iframe>';

我该怎么做呢?对于上面的代码，它给了我'undefined url'错误。

谢谢。

另一个选择是让你的模板调用一个控制器动作(这样你就可以根据需要传递参数)，例如，使用highchart.js:

{% block javascripts %}
    {{ parent() }}
    <script src="/js/highcharts.js"></script>
    <script src="/js/exporting.js"></script>
    <script type="text/javascript">
        {{ render(controller('AppBundle:Default:script')) }}
    </script>
{% endblock %}

在控制器中是这样的:

public function scriptAction() {
    $reports = $this->get('app.reports');
    $chart = $reports->getDistsFYToDate();
    return $this->render('Default/script.js.twig', array(
                'chart' => $chart,
    ));
}

和script.js.twig看起来像这样:

$(document).ready(function () {
    var options = {
        chart: {
            type: 'line'
        },
        title: {
            text: 'Distributions, FY{{ chart.fy }} to date'
        },
        xAxis: {
            categories: [{% for category in chart.categories %}{{category|raw}}{%endfor%}]
        },
        yAxis: {
            title: {
                text: 'Distributions'
            }
        },
        series: {{ chart.series|raw }}
    };
    $('#linechart').highcharts(options);
})

也许使用HTML5数据属性会更好:https://developer.mozilla.org/en-US/docs/Web/Guide/HTML/Using_data_attributes

在您的视图中添加一些脚本标签，并为twig变量分配一个javascript变量。别忘了引用小树枝(如果需要的话)。

首先，我要确保$url总是有一个值;

return $this->render('MyWebBundle:Player:show.html.twig', array(
        'file'             => $file,
        'url'              => (empty($url)) ? '' : $url,
        'context'          => $context,
        'player'           => $player,
        'agentInWhiteList' => $agentInWhiteList
    ));

之类的;

<script>
var jsVar = '{{ url }}';
var html = false;
if (jsVar.length > 0) {
    html = '<iframe src='''+ jsVar +''' name=''viewerIframe'' id=''viewerIframe'' width=''100%''allowfullscreen webkitallowfullscreen height=''100%'' style=''border:0px''></iframe>';
}
// test html !== false before using it
</script>