How to use. NetMVCRazor syntax _ Javascript skills in javascript files

This article mainly introduces how to use RazorJS in Javascript files through a third-party class library. the NetMVCRazor syntax is clever. We recommend that you use javascript nested in a View to directly use the Razor syntax.. NET. The following code is nested in a Razor View:

Script var currDate = '@ DateTime. Now'; // directly call the. NET method console. log (currDate) script

But in another case, if I want to use Razor in an independent JS file, the above method won't work, because MVC won't directly explain the JS file, it can only be placed in Razor view. However, I recommend a third-party class library so that you can directly use Razor in an independent JS file.

The Library name is RazorJS. This is an open-source project. You can download the source code at the following address:

Https://bitbucket.org/djsolid/razorjs

Alternatively, you can install the SDK directly through Nuget:

PM> Install-Package RazorJS

OK. Let's talk about what this class library can bring to us. After installation, you can directly use all methods supported by. NET in the JS file. The above code can be directly put into an independent JS file for use. In addition, you can reference the. NET full name space in the JS File. To call the File object to read the text File content, you can directly reference the System. IO namespace:

@using System.IO; var s = 'Hello at @DateTime.Now \n @File.ReadAllText(System.Web.Hosting.HostingEnvironment.MapPath("~/web.config"))';

After running, you can directly obtain all the content in the web. config file in JS. It looks pretty good, huh, huh. So how does this database work? In fact, it uses a class library named RazorEngine to achieve the above effect. RazorEngine is a Razor interpretation engine with powerful functions that I have used in some projects before. Through this engine, you can even directly use the Razor syntax in win form. Oh, I don't know whether you think of the benefits?

Well, good. With this engine, you can use the MVC Razor in a completely independent web environment. This function allows you to easily develop some flexible templates, for example, you can use various email templates directly. NET method or even custom object, and then dynamically generate the desired content. Okay, but this engine is not what I want to introduce this time. It's just by the way.

Next we will discuss how to use RazorJS. If you install it directly through Nuget, it will automatically help you configure the web. config. This is the recommended installation method. Otherwise, you must add the web. the configuration in config is shown in several places, which are not detailed here. After you install it, you can compare it. To use RazorJS, you only need to use the following syntax to reference the JS file you want:

 @Html.RazorJSInline("~/Scripts/Example.js?6.1.3")

However, you must note that in your web. in config, there is a section of the directory that allows RazorJS to use. That is to say, your JS file must be placed in this directory before you can reference it using this method:

The last thing I want to talk about is its limitations. There are good points, of course, there is a bad side. Because RazorEngine is used, you cannot use the mvc html Helper method in JS, that is, all methods starting with @ Html. Another problem is that it cannot recognize the annotation code in JS, that is, if you use it in the annotation.. NET Method execution is the same. If your method is correct, it will be fine. Otherwise, JS execution will be interrupted and an error will be reported directly, so don't comment out useless methods.

For the problem that @ Html helper cannot be executed, I provide another solution here, but this can modify its source code. If you want to try it, try it. In fact, you can also use many custom methods to make them more flexible and convenient. After downloading the RazorJS source code, you can directly modify it and recompile a DLL. Another method is to use the source code as another project and add it to your own project.

In the source code, open the HtmlTemplateBase. cs file and you can add your own method here. Then, all the methods added here can be called directly in JS. For example, in the source code, you can send an encapsulated Href method to convert the URL to a URL available on the request client. Based on this method, we can add our own method. For example, below is a method for encapsulating a dynamic method to obtain international resource files, which can be directly used in JS. NET resource files are internationalized:

Public class HtmlTemplateBase: TemplateBase {// manually call the resource file manager private static ResourceManager resources = (ResourceManager) System. type. getType ("RazorJS. resource "). getProperty ("ResourceManager "). getValue (null, null); public HtmlTemplateBase () {Url = new UrlHelper (HttpContext. current. request. requestContext);} public string Href (string originalUrl) {return Extensions. resolveUrl (originalUrl);} public string GetLangText (string langKey) {return the relevant language return resources based on the key. getString (langKey) ;}public UrlHelper Url {get; set ;}}

Then you can directly call it in JS:

var s = '@GetLangText("CoderBlog")';console.log(s);

After running, you can directly enter the content of the CoderBlog key in JS.