@ Url.Content en el archivo JavaScript independiente mediante ASPNET MVC 3 y Razor

Question

yo estaba usando este

if (ret = 1) 
    iconType = new google.maps.MarkerImage('@Url.Content("~/Content/images/image.png")'); 
else if (ret = 2) 
    iconType = new google.maps.MarkerImage('@Url.Content("~/Content/images/image2.png")'); 
else if (ret = 3) 
    iconType = new google.maps.MarkerImage('@Url.Content("~/Content/images/image3.png")'); 

en una vista (ASPNET MVC 3), ahora estoy moviendo el código en un archivo JavaScript independiente (Lo estoy usando porque, dependiendo de un valor variable, configuré como imagen de un control image.png, image2.png o image3.png).

Razor no analiza @ Url.Content dentro de un archivo javascript, ¿cuál es la mejor manera de manejar esto?

¡Gracias de antemano! Guillermo.

Answer 1

Yo suelo poner un bloque de este tipo en el comienzo de la página:

<script> 
    var ROOT = '@Url.Content("~")'; 
</script> 

y luego me refiero a la variable ROOT en javascript:

if (ret = 1) 
    iconType = new google.maps.MarkerImage(ROOT + '/Content/images/image.png'); 
else if (ret = 2) 
    iconType = new google.maps.MarkerImage(ROOT + '/Content/images/image2.png'); 
else if (ret = 3) 
    iconType = new google.maps.MarkerImage(ROOT + '/Content/images/image3.png")'); 

Answer 2

Otra solución es la prestación de sus archivos JS completamente a través de RazorViewEngine. De esta manera usted puede fácilmente utilizar la maquinilla de afeitar de sintaxis en el archivo de Javascript:

public class CustomRazorViewEngine : BuildManagerViewEngine 
{ 
    internal static readonly string ViewStartFileName = "_ViewStart"; 

    public CustomRazorViewEngine() 
     : this(null) 
    { 
    } 

    public CustomRazorViewEngine(IViewPageActivator viewPageActivator) 
     : base(viewPageActivator) 
    { 
     AreaViewLocationFormats = new[] 
            { 
             "~/Areas/{2}/Views/{1}/{0}.cshtml", 
             "~/Areas/{2}/Views/{1}/{0}.vbhtml", 
             "~/Areas/{2}/Views/{1}/{0}.csjs", 
             "~/Areas/{2}/Views/Shared/{0}.cshtml", 
             "~/Areas/{2}/Views/Shared/{0}.vbhtml", 
             "~/Areas/{2}/Views/Shared/{0}.csjs" 
            }; 
     AreaMasterLocationFormats = new[] 
             { 
              "~/Areas/{2}/Views/{1}/{0}.cshtml", 
              "~/Areas/{2}/Views/{1}/{0}.vbhtml", 
              "~/Areas/{2}/Views/{1}/{0}.csjs", 
              "~/Areas/{2}/Views/Shared/{0}.cshtml", 
              "~/Areas/{2}/Views/Shared/{0}.vbhtml", 
              "~/Areas/{2}/Views/Shared/{0}.csjs" 
             }; 
     AreaPartialViewLocationFormats = new[] 
              { 
               "~/Areas/{2}/Views/{1}/{0}.cshtml", 
               "~/Areas/{2}/Views/{1}/{0}.vbhtml", 
               "~/Areas/{2}/Views/{1}/{0}.csjs", 
               "~/Areas/{2}/Views/Shared/{0}.cshtml", 
               "~/Areas/{2}/Views/Shared/{0}.vbhtml", 
               "~/Areas/{2}/Views/Shared/{0}.csjs" 
              }; 

     ViewLocationFormats = new[] 
           { 
            "~/Views/{1}/{0}.cshtml", 
            "~/Views/{1}/{0}.vbhtml", 
            "~/Views/{1}/{0}.csjs", 
            "~/Views/Shared/{0}.cshtml", 
            "~/Views/Shared/{0}.vbhtml", 
            "~/Views/Shared/{0}.csjs" 
           }; 
     MasterLocationFormats = new[] 
            { 
             "~/Views/{1}/{0}.cshtml", 
             "~/Views/{1}/{0}.vbhtml", 
             "~/Views/{1}/{0}.csjs", 
             "~/Views/Shared/{0}.cshtml", 
             "~/Views/Shared/{0}.vbhtml", 
             "~/Views/Shared/{0}.csjs" 
            }; 
     PartialViewLocationFormats = new[] 
             { 
              "~/Views/{1}/{0}.cshtml", 
              "~/Views/{1}/{0}.vbhtml", 
              "~/Views/{1}/{0}.csjs", 
              "~/Views/Shared/{0}.cshtml", 
              "~/Views/Shared/{0}.vbhtml", 
              "~/Views/Shared/{0}.csjs" 
             }; 

     FileExtensions = new[] 
          { 
           "cshtml", 
           "vbhtml", 
           "csjs", 
          }; 
    } 

    protected override IView CreatePartialView(ControllerContext controllerContext, string partialPath) 
    { 
     return new RazorView(controllerContext, partialPath, 
          layoutPath: null, runViewStartPages: false, viewStartFileExtensions: FileExtensions, 
          viewPageActivator: ViewPageActivator); 
    } 

    protected override IView CreateView(ControllerContext controllerContext, string viewPath, string masterPath) 
    { 
     var view = new RazorView(controllerContext, viewPath, 
           layoutPath: masterPath, runViewStartPages: true, viewStartFileExtensions: FileExtensions, 
           viewPageActivator: ViewPageActivator); 
     return view; 
    } 
} 

en su archivo asax global sólo tiene que añadir los siguientes:

RazorCodeLanguage.Languages.Add("csjs", new CSharpRazorCodeLanguage()); 
ViewEngines.Engines.Add(new CustomRazorViewEngine()); 

y añadir a la cartografía en la raíz web.config

<system.web> 
      <compilation debug="true" targetFramework="4.0"> 
       <assemblies> 
         <add assembly="Newtonsoft.Json" /> 
         <add assembly="System.Web.Abstractions, Version=4.0.0.0, Culture=neutral, PublicKeyToken=31BF3856AD364E35" /> 
         <add assembly="System.Web.Helpers, Version=1.0.0.0, Culture=neutral, PublicKeyToken=31BF3856AD364E35" /> 
         <add assembly="System.Web.Routing, Version=4.0.0.0, Culture=neutral, PublicKeyToken=31BF3856AD364E35" /> 
         <add assembly="System.Web.Mvc, Version=3.0.0.0, Culture=neutral, PublicKeyToken=31BF3856AD364E35" /> 
         <add assembly="System.Web.WebPages, Version=1.0.0.0, Culture=neutral, PublicKeyToken=31BF3856AD364E35" /> 
       </assemblies> 

       <!--Added--> 
       <buildProviders> 
         <add extension=".csjs" type="System.Web.WebPages.Razor.RazorBuildProvider, System.Web.WebPages.Razor"/> 
       </buildProviders> 

¡Ahora puede incluso trabajar con un Modelo dentro de su archivo javascript!

public ActionResult MyJavascriptThroughRazor() 
{ 
    var someModel = ... 
    return PartialView("filenamewithcsjsextension",someModel); 
}