| Syntax/Sample | Razor | Web Forms Equivalent (or remarks) |
| Code Block | @{
int x = 123;
string y = "because.";
}
|
<%
int x = 123;
string y = "because.";
%>
|
| Expression (Html Encoded) |
<span>@model.Message</span>
|
<span><%: model.Message %></span>
|
| Expression (Unencoded) |
<span>
@Html.Raw(model.Message)
</span>
|
<span><%= model.Message %></span>
|
| Combining Text and markup |
@foreach(var item in items) {
<span>@item.Prop</span>
}
|
<% foreach(var item in items) { %>
<span><%: item.Prop %></span>
<% } %>
|
| Mixing code and Plain text |
@if (foo) {
<text>Plain Text</text>
}
|
<% if (foo) { %>
Plain Text
<% } %>
|
| Mixing code and plain text (alternate) |
@if (foo) {
@:Plain Text is @bar
}
|
Same as above |
| Email Addresses |
Hi philha@example.com
|
Razor recognizes basic email format and is smart enough not to treat the @ as a code delimiter |
| Explicit Expression |
<span>ISBN@(isbnNumber)</span>
|
In this case, we need to be explicit about the expression by using parentheses. |
| Escaping the @ sign |
<span>In Razor, you use the
@@foo to display the value
of foo</span>
|
@@ renders a single @ in the response. |
| Server side Comment |
@*
This is a server side
multiline comment
*@
|
<%--
This is a server side
multiline comment
--%>
|
| Calling generic method |
@(MyClass.MyMethod<AType>())
|
Use parentheses to be explicit about what the expression is. |
| Creating a Razor Delegate |
@{
Func<dynamic, object> b =
@<strong>@item</strong>;
}
@b("Bold this")
|
Generates a Func<T, HelperResult> that you can call from within Razor. See this blog post for more details. |
| Mixing expressions and text |
Hello @title. @name.
|
Hello <%: title %>. <%: name %>.
|
| NEW IN RAZOR v2.0/ASP.NET MVC 4 |
| Conditional attributes |
<div class="@className"></div>
|
When className = null<div></div>
When className = ""
<div class=""></div>
When className = "my-class"
<div class="my-class"></div>
|
| Conditional attributes with other literal values |
<div class="@className foo bar">
</div>
|
When className = null<div class="foo bar"></div>
Notice the leading space in front of foo is removed.
When className = "my-class"
<div class="my-class foo bar">
</div>
|
Conditional data-* attributes.
data-* attributes are always rendered. |
<div data-x="@xpos"></div>
|
When xpos = null or ""<div data-x=""></div>
When xpos = "42"
<div data-x="42"></div>
|
| Boolean attributes |
<input type="checkbox"
checked="@isChecked" />
|
When isChecked = true
<input type="checkbox"
checked="checked" />
When isChecked = false
<input type="checkbox" />
|
| URL Resolution with tilde |
<script src="~/myscript.js">
</script>
|
When the app is at /
<script src="/myscript.js">
</script>
When running in a virtual application named MyApp
<script src="/MyApp/myscript.js">
</script>
|