使用 Twig 路径的 Ajax url 参数

Question

当我在 ajax url 路径中传递参数时，我的 twig 视图出现问题， 从逻辑上讲，twig 在 javascript 之前执行，因此他无法识别作为参数传递的输入值。有没有解决方案可以在不传递 data 参数的情况下执行此操作？

 <script type="text/javascript" charset="UTF-8">
(function($) {

    var $projectField = $('#project-field-container');

    $projectField.on('change', function() {
        var id_project = $(this).val();
        if('' != id_project) {
            $.ajax({
                url: {{ path('project_field', {'id_project': id_project})}},
                success: function (data) {
                    var content = $('select', data.contentHTML).html();
                    $projectField.html(content).trigger('change');
                }
            });
        } else {

        }
    });
})(jQuery);

Answer 1

为此，您应该使用 FOSJsRoutingBundle。它有一个与 Twig 类似甚至相同的界面

{{ path() }}

并且允许您只向 Javascript 公开一小部分路由。

您的 js 实现将能够生成路由 正如您在文档中看到的那样。

Answer 2

也许你可以尝试将 twig 语句分配给 js 变量（在调用 ajax 之前），如下所示：

var path = {{ path('project_field', {'id_project': id_project})}};

然后使用

url: path

在你的ajax请求中。

Answer 3

你可以添加

data-url="{{ path('project_field', {'id_project': id_project}) }}"

并通过你的js访问它

<script type="text/javascript" charset="UTF-8">

(function($) {

var $projectField = $('#project-field-container');

$projectField.on('change', function() {

    var url = $(this).data('url');

    $.ajax({
      url: url,
      success: function (data) {
            var content = $('select', data.contentHTML).html();
                $projectField.html(content).trigger('change');
            },
      error: function (data) {
            console.log(data);
        }
      });
    });
})(jQuery);