Question

As explained in the official Symfony2 docs, in a Twig template one can link to an asset as follows:

<img src="{{ asset('images/logo.png') }}" alt="My logo" />

which will render the right path to the logo.png resource (it depends on the folder where the Symfony2 app lives).

Well, suppose to use a Javascript code that has to load an image at runtime (e.g. as a result from an autocomplete), how can one achieve in Javascript the same result provided by asset function in Twig?

Some note:

1. Maybe exists something like the FOSJsRoutingBundle, but I really ignore it!
2. A dirty way could be to generate the path for a known resource, e.g. the logo.png file <script>var known = {{asset('images/logo.png)')}}</script> and so retrieve the path by a string replace on variable known by replacing string images/logo.png with an empty one. But it is a dirty way!

Answer 1

You can just remove the file name from the asset function to get an absolute path to a directory:

<script>
    var imgDir = {{ asset('images/') }}
</script>