Difference between revisions of "Razor"
(Created page with "Category:MVC Category:ASP.NET Category:CSharp Category:TODO Razor is a template syntax that allows you to combine code and content in a fluid and expressive m...") |
m (1 revision imported) |
(No difference)
| |
Latest revision as of 14:27, 9 May 2016
Razor is a template syntax that allows you to combine code and content in a fluid and expressive manner. Though it introduces a few symbols and keywords, Razor is not a new language. Instead, Razor lets you write code using languages you probably already know, such as C# or Visual Basic .NET.
@if(User.IsAuthenticated)
{
Hello, @User.Username!
}
else
{
Please @Html.ActionLink("log in")
}
Contents
Differentiating Code and Markup
Razor provides two ways to differentiate code from markup: code nuggets and code blocks.
Code Nuggets
Code nuggets are simple expressions that are evaluated and rendered inline. They can be mixed with text and look like this:
Not Logged In: @Html.ActionLink("Login", "Login")
The expression begins immediately after the @ symbol, and Razor is smart enough to know that the closing parenthesis indicates the end of this particular statement. The previous example will render this output:
Not Logged In: <a href="/Login">Login</a>
Explicit code nuggets
The explicit code nugget syntax (@( )) allows you to wrap a code statement, unambiguously marking the beginning and end of the statement.
Code Blocks
A code block is a section of the view that contains strictly code rather than a combi- nation of markup and code. Razor defines a code block as any section of a Razor template wrapped in @{ } characters. The @{ characters mark the beginning of the block, followed by any number of lines of code. The } character closes the code block. Keep in mind that the code within a code block is not like code in a code nugget. It is fully-formed code that must follow the rules of the current language; for example, each line of code written in C# must include a semicolon (;) at the end, just as if it lived within a class in a .cs file. Here is an example of a typical code block:
@{
LayoutPage = "~/Views/Shared/_Layout.cshtml";
View.Title = "Product Details for " + Model.ProductName;
}
The @: character sequence
The @: character sequence The @: character sequence indicates a transition, telling Razor to assume that the con- tent that follows the sequence is content, not code
@if(User.IsAuthenticated)
{
@:Hello, @User.Name!
}
else
{
@:Please login
}
The <text> block
The <text> block is an alternative to the @: character sequence that allows you to denote that an entire portion of a template is content.
@if(!User.IsAuthenticated)
{
<text>
Guests are not allowed to view this content.
Please @Html.ActionLink("login", "Login") to view.
</text>
}
Comments
@* *@
Organizing Razor Templates
Layouts
A layout template typically includes the main markup (scripts, CSS stylesheets, and structural HTML elements, such as navigation and content containers), specifying lo- cations within the markup in which pages can define content. Each page in the site refers to this layout, including only the content within the locations the layout has indicated.
Take a look at a typical Razor layout file (_Layout.cshtml):
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>@View.Title</title>
</head>
<body>
@RenderSection("Header")
@RenderBody()
</body> </html>
Once a Razor layout is defined, pages reference the layout and supply content for the sections defined within the layout. The following is a basic content page that refers to the previously defined _Layout.cshtml file:
@{ Layout = "~/_Layout.cshtml"; }
@section Header {
Syntax :
@section [Section Name]
{
[ Razor content, code, and markup ]
}
IsSectionDefined
Determines whether a section of a given name is defined in the content view.
@RenderBody()
@if(IsSectionDefined("Footer"))
{
}
Nested Layouts
Layouts can also be “nested.” A nested layout is any layout that refers to another, outer layout.
Partial Views
RenderPage("Posts/_Post.cshtml", new { Post = post })
=== Razor Helpers ===
