A JavaScript implementation of the Razor view engine that aims to be simple and compatible for use both in the browser and in Node--simple enough for templating:
Razor.compile('hello @model.name')({ name: 'world' }) == 'hello world' As well as a Node view-engine:
var http = require('http'), url = require('url'), Razor = require('../bin/node/Razor.js'); http.createServer(function (req, res) { var uri = url.parse(req.url), path = uri.pathname.substr(1) || 'index'; Razor.view(path, function(template) { if(template) { template({ name: 'Andy Edinborough' }, function(html){ res.writeHead(200, {'Content-Type': 'text/html'}); res.end(html); }); } else { res.writeHead(404, {'Content-Type': 'text/html'}); res.end('<h1>Not Found</h1>'); } }); }).listen(1337, "127.0.0.1"); Try RazorJS in your browser now: http://jsbin.com/imihov/latest
<tr> <td valign="top">Code Block</td> <td valign="top"> <pre> @{ var x = 123; var y = "because."; }
<tr> <td valign="top">Expression (Html Encoded)</td> <td valign="top"> <pre> <span>@model.message</span>
<tr> <td valign="top">Expression (Unencoded)</td> <td valign="top"> <pre> <span> @html.raw(model.message) </span>
<tr> <td valign="top">Combining Text and markup</td> <td valign="top"> <pre> @{ model.items.forEach(function(item) { <span>@item.Prop</span> }); }
<tr> <td valign="top">Mixing code and Plain text</td> <td valign="top"> <pre> @if (foo) { <text>Plain Text</text> }
<tr> <td valign="top">Mixing code and plain text (alternate)</td> <td valign="top"> <pre> @if (foo) { @:Plain Text is @bar }
<tr> <td valign="top">Email Addresses</td> <td valign="top"> <pre> <td valign="top">Razor recognizes basic email format and is smart enough not to treat the @ as a code delimiter</td> </tr> <tr> <td valign="top">Explicit Expression</td> <td valign="top"> <pre> <span>ISBN@(isbnNumber)</span>
<td valign="top">In this case, we need to be explicit about the expression by using parentheses.</td> </tr> <tr> <td valign="top">Escaping the @ sign</td> <td valign="top"> <pre> <span>In Razor, you use the @@foo to display the value of foo</span>
<td valign="top">@@ renders a single @ in the response.</td> </tr> <tr> <td valign="top">Server side Comment</td> <td valign="top"> <pre> @* This is a server side multiline comment *@
<tr> <td valign="top">Mixing expressions and text</td> <td valign="top"> <pre> Hello @title. @name.
<tr> <td valign="top">Partials </td> <td> <pre> @html.renderPartial('another-view')
<tr> <td valign="top">Layouts </td> <td> <strong>View</strong> <pre> @{ this.layout = '_layout'; }
@section my_section(){ @:hi! }
Layout
@this.renderBody() @this.renderSection('my_section') | Description | Code | Notes |
|---|---|---|
shamelessly stolen from @haacked (http://haacked.com/archive/2011/01/06/razor-syntax-quick-reference.aspx) and modified for RazorJS