Rolling with Razor in MVC Preview – Part 4

Coding in Razor
When last we met…
In the last installment, we took a look at partial views in the Razor engine. Our last stop on the current preview view engine will be looking at the various control structures and other features provided by this version of Razor. Of course, as soon as another preview comes out, we’ll take a look at that as well.

First, let’s make something abundantly clear. Views are not the place for a ton of code. They are not the place for business logic. No matter how cool Razor is, or how easy it is to use, don’t forget that there is a reason you are using ASP.NET MVC in the first place. Just in case I didn’t make it clear, a view is just a view! Not a place to do the majority of your information processing. Clear? Good. Let’s move on.

As mentioned in earlier parts of this tutorial, Razor code blocks are delineated by:

@{….}

And variable assignment and viewing is designated by @, such as @username

These two syntaxes are equivalent to <% %>and <%: %>when using the asp.net view engine (note that <%:%>replaces <%= %>and does an automatic call to HtmlEncode). In a similar fashion, if statements and other control constructs can be placed within these asp.net brackets, but it leads to some really horrendous looking code:

<% if (IsValidOperation) %>
User selected <%: operation%>
<% else %>
Invalid operation for <%:user%>

Now admittedly, this isn’t particularly hard to do but it is ugly. It is also somewhat difficult to keep things looking clean and visualizing the flow of the View. Contrast that with the Razor view engine’s approach which looks like:

@if (IsValidOperation)
{
User selected @operation
}
@else
{
Invalid operation for @user
}

A couple really cool things worth noticing:
1. We don’t need an end terminator (no %>).
2. The code is intermixed with the Html in a much more elegant and natural flow.

You denote a multi-line block of code using @{}. Similarly, you can have what is known as a multi-token statement to further enhance the flexibility of your view code. An example of this would be if we wanted to display a user’s first, middle and last name.

With the aspx.net view engine you would write something like:

<%:User.First%><%:User.Middle %><%:User.Last %>

Similarly, you could use:

@User.First @User.Middle @User.Last in straight Razor.

Or, finally you can use @(User.First + “ “ + User.Middle + “ “ + User.Last)

Either of the options is fine. It’s up to you.

We can use for statements and while statements as easily as the if statements. Basically, its C#.
A rather contrived for loop example is shown below:

@for(int i=0; i<10; i++)
{


• 
  send email to fu@bar.com with user id @i
  

}

The interesting thing here is that the Razor engine can discern that fu@bar.com is not a variable usage and @i is. Note that in the above example, you must have the extra @ within a containing element (li in this case) or you will get an error. You can also use @() here.

Similarly, a foreach loop looks like:

@foreach(var item in items)
{
…
}

and a while loop looks like:

@while (x < 5)
{
x++;
}

Now when you want to nest blocks of html within your logic, it is suggested that you use a wrapping element. For example:

@If (x == 5)
{

Some text

}

This serves two purposes. First, it clearly identifies the div as a block of content. Secondly it gives you an easy way to manipulate the block via css and jQuery.

A few things should be kept in mind. First, remember that this is an initial preview. Just because your code works today in the Razor view engine doesn’t mean it will work tomorrow. There is no guarantee there will not be dramatic changes between the various previews, beta and finally rtm. Anybody who worked with the original ctp of ASP.NET MVC can relate. Some of the changes introduced along the way were quite drastic.

Additionally there is currently limited (as in almost no) support in Visual Studio 2010 for Razor yet. That means no intellisense. It is coming, but it is not there yet. Now, I know the average developer these days feels lost without intellisense but give it a try. Generations of programmers before you lived without it and were quite productive.

Ultimately, the Razor view engine really doesn’t bring anything to the table that you can’t currently do with the ASP.NET Web forms view engine or any of the other engines out there. At least not yet. But it does provide a clean, well thought out interface which melds very well with html. It also further differentiates asp.net from asp.net mvc. Whether that is a good thing or not is entirely your own decision.

Wrapping up this series, we’ve basically looked at all the major features of the Razor view engine in the ASP.Net mvc 3 preview release. More features are coming including some really excellent template support, but those are not yet available. When they are, I will examine of them and post updates with any changes impacted by new releases. I hope you’ve found this tutorial helpful. Razor is a clean, expressive way to build your views and a welcome addition to the list of available view engines.

Written by Larry Schoeneman.

Larry Schoeneman is a software developer with over 20 years of experience, focused on Microsoft products and technologies as well as utilizing agile methodologies to build better software.

If you found this post useful you may also want to check these out:

Rolling with Razor in MVC v3 Preview – Part 1Rolling with Razor in MVC v3 Preview – Part 2Rolling with Razor in MVC v3 Preview – Part 3Get Rolling With jQuery – Part 2Get Rolling With jQuery – Part 3How to sell SEO to the Web Challenged (Part 1)

Complete Post View here