asp.net MVC 3 Razor view engine __.net

Source: Internet
Author: User

A new view Engine:razor is introduced in ASP.net MVC 3. Using razor does not require learning new languages, it is easier to combine dynamic code with HTML, discard tags like <%%>, and use a magic @ To get everything done, just as the $ number in jquery is generally magical and can leave us with more clean HTML code. Compared to ASPX, in the VS2010, razor more intelligent, now write a model of the type declaration can finally rely on syntax prompts to complete.

Type @model webapplication1.models in the first line of the view. There will be smart tips to get it done.

The view of the razor engine is in the cshtml format, and the syntax of the next two scripting engines is compared below, as described in Scott's blog. First of all, international practice, first, Hello World. Hello World

To implement the page as shown:

Use. ASPX, we need to write <%=%> syntax to output a variable, as follows:

Output A variable that requires five characters <%=%>, and% this character needs to be pressed shift+5, is a character that is not easy to enter. If we use razor, like the following:

The razor parser can read the syntax of C#/VB and provide IntelliSense, so the code above does not need to specify the code block explicitly. Razor can recognize the above statements and use them as self-contained blocks of code. In the code above, we only need 1 @ characters to output a variable , 4 more than ASPX. And the @ number is much easier to knock than its%, so the keyboard will be more fluent when you enter code. loops and HTML nesting

Let's take a look at another simple scenario where you need to list some of the product names at a very price:

Use. aspx

Using ASP.net syntax, we need to declare this code in more than one place with <%%>.

Use Razor:

See if it's much simpler. Because razor can recognize the semantics of C#/VB, it automatically handles the first and last lines of foreach as blocks of code. and can automatically provide syntax hints for object p. This makes the coding more concise, can greatly improve the coding process efficiency. IF Statement and Multiline statement (Razor only)

If statement,

Multi-line statement:

You can declare multiple lines of code using @{codes}

It can also be used directly as follows @ ()

integrating content with code

See the @ symbol, will naturally contact the email, if we embed the code, there is an email address, will be how to deal with it. Razor will analyze the contents of the @ right, whether it is a Razor object or variable, so the email address will not be mistakenly resolved:

You want to output an @ number, then the input @@ 就 OK.

Identify the embedded content

When embedding HTML content into If-else, for, foreach, or other block statements, you need to include content in HTML or XML tags so that razor can better identify the content.

For example, the following code contains multiple rows of content in:

Will output:

If you don't want to use an HTML tag to surround the content, you can use a tag, as shown below

The output

HTML encoding

By default, all content that uses the @ output is automatically HTML coded to better place XSS attacks. If you must output HTML code, such as the HTML code for the margin of a rich text editor, you need to use the following method:

@ (new mvchtmlstring (article). Body))

This will not be HTML coded. Layout/masterpage-Foundation

Starting with ASP.net 2.0, you provide the functionality of the MasterPage master page, which allows you to use a consistent look for pages in your Web site. Razor can also support this concept, in razor, using layout pages to provide this functionality. Allows you to define a generic site touch it and then inherit that look in all of your views.

A simple layout example

The following is a simple layout example that can contain all of the static HTML content, or it can contain dynamic server-side code. We can call the @renderbody () helper method where we need to insert the content of the specified topic.

Then we can create a home.cshtml view that uses this layout page, just to add layoutpage= "sitelayout.cshtml" to the head, which looks like a beta, official version of layout= "..."

layout/masterpage Scene-Add section

In razor, you can render multiple section in layout, and then selectively populate the section in view. This provides a great deal of flexibility for the page layout of your site.

For example, to the left of the layout page, you can add a menu display, so you can write a layout page

@RenderSection ("menu", Required:false)

In the page that needs the menu, we define this section

@setion menu{
Sub-menu "> Menu item 1 menu item 2}

If you don't need a menu, don't define this section, there's no menu. Encapsulation-reusing Html assistants

In asp.net mvc, many helper functions are used, and the most common is Html Helpers.

Code-based HTML Helpers

asp.net MVC uses the concept of HTML helpers, these helpers are methods that can be invoked in code blocks that generate HTML code. These methods are generally written as extension methods, written using pure code. All HTML extension methods in asp.net mvc can work in razor without changing any code:

Declaring HTML Helpers

Using pure code to generate HTML is fine, but not ideal. In razor, there is a much easier way to generate a reusable HTML helper. Use @helper{} to declare:

Then, we can call this pager in the view

Visual Studio provides good support for Razor, fully supports IntelliSense

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.