First, Razor grammar
1. Razor identifier
Explanation: The @ character is defined as the identifier of the Razor server code block, followed by the server code. It is a good idea to use <%%> to write server code in Web Form. The function of code coloring and intelligent sensing is provided in the VS tool.
@{ String userName = "Kai Super"; < span > My name is: @userName</span> <span > My date of birth: @DateTime. Now.tostring ("Yyyy-mm-dd"); </ span > }2, the scope of razor
explanation: In the above example has been used in curly braces {}, good, curly braces is the scope of the expression scope, with a shape such as "@{code}" to write a block of code. The output in the scope "@ (code)" is also used with the @ symbol.
Index.cshtml page:
My age: @{ int = years; string sex = "male"; @age } Sex: @ (Sex)3, Razor and HTML mixed writing
Explanation:
A. The scope content is treated as text output if it starts with an HTML tag
B. If output @, use @@
C. If you want to output non-HTML tags and non-razor statements of code, then with "@:", his role is equivalent to be written under the HTML, if the "@:" followed by the "@" represents a variable of the Razor statement, as follows:
index.cshtml page:
@{ var strzm = " abc " this is a Mail:2734796332 @qq. com. this is var : @strzm, this is [Email protected],this @@ // output ABC @strzm} 4. Razor type Conversion
Explanation: As Series extension method and is Series extension method (string type to go)
Asint (), Isint ()
Asbool (), Isbool ()
Asfloat (), Isfloat ()
Asdecimal (), Isdecimal ()
Asdatetime (), Isdatetime ()
ToString ()
Index.cshtml page:
@{ string"123"; } string to int: @ss. Asint ()5, Razor Other
Explanation:
@Href ("~/")//indicates the root directory of the Web site
@Html. Raw (' <font color= ' red > Scarlet Letter </font> ') will display the Red "Scarlet Letter", which will display the Html string directly (<font color= ' red ' > Red character). </font>)
————————————————————————————————————————————
Second, Razor engine
1. Layout (@RenderBody () method)
Explanation: Layout mode is the same as a template, we add code at its address. Equivalent to defining a framework, as a master page, use the @renderbody () method where the page below it needs to modify different code.
Master page: (~/views/layout/_sitelayout.cshtml)
<!DOCTYPE HTML><HTMLLang= "en"> <Head> <MetaCharSet= "Utf-8"/> <title>My Site-@Page. Title</title> </Head> <Body>@RenderBody ()</Body></HTML>
Sub-page: (~/views/home/about.cshtml)
@{ Layout = "~/views/layout/_sitelayout.cshtml";} < H1 > about My site </H1><p> This is something that is displayed on this page about us, and we use the Sitelayout.cshtml page as the master pages. < /> Current time: @DateTime. Now</p>2. Page (@RenderPage () method)
Explanation: page needs to be used when it is necessary to output the contents of another Razor file (page) in one page, such as the common content of the head or tail, using the @renderpage () method
Master page: (~/views/layout/_sitelayout.cshtml)
<!DOCTYPE HTML><HTML><Head> <Metaname= "Viewport"content= "Width=device-width" /> <title>Simple Site</title></Head><Body> <!--Head -@RenderPage ("~/views/layout/_header.cshtml")<!--Bottom -@RenderPage ("~/views/layout/_footer.cshtml")</Body></HTML>
public page: (~/views/layout/_header.cshtml)
<DivID= "header"> <ahref="#">Home</a> <ahref="#">About Us</a> </Div>
3. Section area (@RenderSection ())
Explanation: section is defined for use in Layout pages. In the layout page. Use the @rendersection () method in the parent page that you want to layout.
master page: (~/views/layout/_sitelayout.cshtml)
<!DOCTYPE HTML><HTML><Head> <Metaname= "Viewport"content= "Width=device-width" /> <title>Simple Site</title></Head><Body> <DivID= "Left-menu">@RenderSection ("menu", true)</Div></Body></HTML>
public page: (~/views/layout/_menu.cshtml)
@{Layout = "~/views/layout/_sitelayout.cshtml";}<H1>about my website</H1><P>This is something that is displayed on this page about us, and we use the Sitelayout.cshtml page as the master pages. <BR/>Current time: @DateTime. Now</P>@section menu{<ulID= "Sub-menu"> <Li>Menu 1</Li> <Li>Menu 2</Li> <Li>Menu 3</Li> <Li>Menu 4</Li> </ul> }
if the menu is not implemented in the sub-page, an exception is thrown. We can overload it with @rendersection ("menu", false)
@if (issectiondefined ("menu")) { @RenderSection ("menu "false)}else { is not defined!</p >}4. Helper
@helper is the ability to define reusable helper methods that can be used not only in different places on the same page, but also on different pages.
4.1. Create a new helpermath.cshtml page
4.2, Helpermath.cshtml page writing method
@* sum *@ @helper sum (intint b) { int result = a + b; @result}4.3. index.cshtml page Call
1+2[email protected] (12) <br/>
Razor grammar and Razor engine encyclopedia
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
