ASP. NET MVC5 + EF6 getting started tutorial (6) Use Razor in View, mvc5ef6

ASP. NET MVC5 + EF6 getting started tutorial (6) Use Razor in View, mvc5ef6

Source: Slark. NET-blog Park http://www.cnblogs.com/slark/p/mvc-5-ef-6-get-started-model.html

Previous section: ASP. NET MVC5 + EF6 getting started tutorial (5) Model and Entity Framework

Download source code: Click here to download

1. Introduction to Razor

View the files in the Views folder in Solution Explorer, as shown in.

All file suffixes are. cshtml. What file is this? As the name implies, cshtml = cs + html is an HTML file containing C Sharp (C #) code.

Since the file contains the client code in the original HTML file and the server code such as C #, we have to identify the two types of code. Here we need Razor.

What is Razor? A view engine? Which expert is expected to give me a high-level definition.

In my opinion, Razor is a markup language that distinguishes server-side code from other code.

Ii. Razor comments

To better observe the running results, we disable the template here. Open the _ ViewStart. cshtml file in the Views folder. Comment out all the codes, as shown in.

@*@{    Layout = "~/Views/Shared/_Layout.cshtml";}*@

From the above we can see that the multiline comment in the cshtml file is written at the beginning of the first line @ * And then written at the end of the last line *@.

The single line comment of Razor is similar to this form. Write @ * at the beginning of the row and write @ at the end of the row, as shown below.

@* A one line code comment *@

3. Three basic forms of Razor

Razor identifies the code in the specified region as the server code in three ways:

• Inline flag
• Single Line Mark
• Multi-Line Mark

Open the Index. cshtml file in the First folder under the Views folder. Write the following code. In the figure, the yellow part is the server C # Code marked by Razor.

<Div>
<! -- Single Line -->
@ {Var name = "Slark ";}
@ {Response. Write ("Single Line: Name is" + name + "<br/> ");}

<! -- Inline -->
Inline: Today is: @ DateTime. Now. ToString ("yyyy-MM-dd") <br/>
Inline: Name is @ name <br/>

<! -- Multi-Line -->
@{
Var age = 25;
Response. Write ("Multi-Line: Age is" + age + "<br/> ");
}
</Div>

From the code above, we can see that marking @ in the row can be followed by a defined variable or function with a returned value.

Each row in a single row tag contains a C # statement ending with a semicolon.

A multiline mark contains multiple C # statements.

Iv. Statement running sequence

Select Index. cshtml you just edited and click "view in Browser" in the menu bar. The result is as follows.

Right-click the page and select "View Source". The result is as follows:

Single Line : Name isSlark<br />Multi-Line : Age is 25<br /><div>    <!--Single Line-->    <!--Inline-->    Inline : Today is:2014-12-13 　　<br />    Inline : Name is Slark 　　<br />    <!--Multi-Line--></div>

Is the running result different from what you think. The execution sequence of this file is as follows:

• The server searches for the C # code in the Razor mark line by line in this file. If you read the C # single line or multiple lines of code, execute it. The output result is the green part of the code above. If you find the line code, replace the Code with the corresponding value, corresponding to the yellow part of the code above. After processing the file again.
• The server then writes all non-Razor code in the file to be output, corresponding to the blue and yellow sections in the above Code.

V. keyword () {} Special syntax

When a C # code structure in the form of "keyword () {}", such as if, for, and while, the Razor mark can be written as "@ keyword ().

This is not mandatory. The following two examples are used for comparison.

Comment out the existing code in Index. cshtml. Add the following code:

@ If (1> 2)
{
Response. Write ("1> 2 <br/> ");
}
Else
{
Response. Write ("1 <= 2 <br/> ");
}

@ For (int I = 0; I <3; I ++)
{
Response. Write (I + "<br/> ");
}

Click View in the browser. The following result is displayed:

6. Write text in the Razor mark

Comment out the original Index. cshtml code and write the following code.

@{    var name1 = "Slark";    <p>var name2 = "Slark";</p>    @:var name3 = "Slark";<br />    <text>            var name4 = "Slark";<br />            var name5 = "Slark";    </text>}

Does the Code look strange? Let's take a look at the execution result:

Generally, the code in @ {} is run only as a C # code. In the above Code, only name1 is processed as a C # code, and several other lines are output as text.

Previously, I used to introduce how to embed server code into html files. Now I want to introduce how to embed html code into server code...

As shown in the code above, there are three methods in total:

• In the Code marked by Razor, if there is a correct html Tag, the tag and its content will be output as common text. <P> var name2 = "Slark"; </p>
• If "@:" is included in the Code marked by Razor, the subsequent line of code is output as normal text. @: Var name3 = "Slark"; <br/>
• If <text>... </text> is marked in the Code marked by Razor, the content is output as normal text. <Text> var name4 = "Slark"; <br/> var name5 = "Slark"; </text>

Your recommendations and comments are the motivation for continued updates. Thank you.

Previous section: ASP. NET MVC5 + EF6 getting started tutorial (5) Model and Entity Framework