如何在js文件中获取路由路径答案

【问题标题】：How to get routing path in js file如何在js文件中获取路由路径
【发布时间】：2015-04-27 12:59:37
【问题描述】：

我有一个 new.html.twig，我在这个页面上使用了几个 ajax 调用来更改下拉事件。

所以我创建了一个名为 new.js 的独立 js 文件，并将我的所有 JavaScript 代码保存在该文件中，而不是将其写入同一个视图文件中。

但是在这个 js 文件中，我无法访问称为 ajax 请求的路由路径。更改事件。

===========New.twig.html=====================
    include(new.js);
    <select><name='a' onchange="setLabel('123')"></select>
    ============new.js.=============        
    function setLabel(voucherTypeID) {           
    queryString = "voucherTypeID=" + voucherTypeID;
    $('#loading-image').show();
    $.ajax({
    type: "POST",
    url: "{{path('vouchergeneration_getLedgers')}}", //THIS PATH How TO GET
    data: queryString,
    cache: "false",
    dataType: "html",
    success: function (data){
    });

所以在这里我无法访问 URL 路径，而之前可以在 twig 文件中访问它。请指导我如何解决这个问题。我不想使用任何类型的 Bundle 来完成这项简单的工作..提前致谢..

【问题讨论】：

标签： php jquery mongodb symfony

【解决方案1】：

这个简单的工作有一个非常简单的捆绑包FOSJsRoutingBundle

启用此捆绑包后，您只需要做

Routing.generate('my_route_to_expose', { id: 10 }); // will result in
/foo/10/bar

Routing.generate('my_route_to_expose', { id: 10, foo: "bar" }); //
will result in /foo/10/bar?foo=bar

$.get(Routing.generate('my_route_to_expose', { id: 10, foo: "bar" }));
// will call /foo/10/bar?foo=bar

Routing.generate('my_route_to_expose_with_defaults'); // will result
in /blog/1

Routing.generate('my_route_to_expose_with_defaults', { id: 2 }); //
will result in /blog/2

Routing.generate('my_route_to_expose_with_defaults', { foo: "bar" });
// will result in /blog/1?foo=bar

Routing.generate('my_route_to_expose_with_defaults', { id: 2, foo:
"bar" }); // will result in /blog/2?foo=bar

编辑： 当然，您可以不使用捆绑软件（我认为这不是一个好主意）。在这种情况下，我建议在控制器的操作中设置您的路线，并在树枝模板中设置使用它来设置 js 变量。比如：

控制器：

public function indexAction()
{
    return array('yourRoute' => $router->generate('yourRoutName'));
}

您的模板：

<script type="text/javascript">
    var yourRoute = '{{yourRoute}}';
</script>

你的 js：

(...)
url: yourRoute,
(...)

【讨论】：

实际上，到目前为止，我的应用程序中还没有使用任何类型的捆绑软件。所以请你告诉我另一种方法来解决这个问题.. 没有 FOS 路由包
检查我的编辑，但我没有看到避免捆绑的意义。 Twig、Doctrine 等 - 这些都是捆绑包，所以无论哪种方式你都可以使用它。为什么要重新发明轮子？
在控制器中生成路由并将其传递给 Twig 并没有真正的优势。为此，您可以使用 Twig 中的 path() 和 url() 函数。

【解决方案2】：

如果您想嵌入一个 URL 并通过您的 JS 获取它，您可以执行以下操作：

// HTML/Twig
<html data-my-route="{{ path('vouchergeneration_getLedgers') }}">
    ...
</html>

然后在你的 JS 中：

$.ajax({
    type: "POST",
    url: $('html').attr('data-my-route'),
    data: queryString,
    cache: "false",
    dataType: "html",
    success: function (data){
});

它避免了全局变量，并且您可以使用任意数量的数据属性。

【讨论】：

我可以这样使用：

因为我在同一个树枝上有 5-6 次 ajax 调用用于不同的目的。而不是写它我们可以只在 twig 文件中写一个标记..
您可以根据需要添加任意数量的数据属性；）如<html data-ledger-one="{{path('vouchergeneration_getLedgers') }}" data-ledget-two="{{path('vouchergeneration_getLedgers2') }}">..</html>。你明白吗？顺便说一句，如果可能的话，我建议你只有一个根据参数过滤结果的路由:)

【解决方案3】：

如果您使用的是 fetch，那么您可以使用 data.url 获取帖子的 url：

  fetch('/check', {
      method: 'POST', // or 'PUT'
      headers: {
        'Content-Type': 'application/json'
      },
      body: JSON.stringify(qrinfo)
    })
    .then((data) => {
      let url = data.url;
      if(url.includes('/leave.html')) {
        window.location.replace('/leave.html');

      }
      else {
        console.log("Page not changed.");
      }
      console.log('Success:', data);
    })
    .catch((error) => {
      console.error('Error:', error);
    });

您可以使用.includes() 检查路径名是否包含在 url 中，因此更改端口不会成为问题。

【讨论】：