iopa-template-razor

About

iopa-template-razor is IOPA middleware for rendering templates using razor view engine

Installation

$ npm install iopa-template-razor

Credits

This project, including documentation, was forked under MIT license from andyedinborough/RazorJS with various changes throughout to filename and package handling, and so that it that is easier to consume from OWIN-JS, Connect, Koa, and Express middleware.

To date, the raw parsing routines have not been adjusted materially from the RazorJS implementation.

API

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.lib.compile('hello @model.name')({ name: 'world' }) == 'hello world'

As well as an IOPA view-engine:

const iopa = require('iopa'),
    templates = require('iopa-templates'),
    razor = require('iopa-template-razor'),
    http = require('http'),
    iopaConnect = require('iopa-connect')

var app = new iopa.App();

app.use(templates);

app.engine('.jshtml', razor({views: 'test/views' }));
    
app.use(function(context, next) {
    return context.render('home.jshtml', {data: { message: "Hello World" } });
});

http.createServer(app.buildHttp()).listen(3000);

Live Demo (of underlying view engine technology)

Try RazorJS in your browser now: http://jsbin.com/imihov/latest

Syntax

  <tr>
      <td valign="top">Code Block</td>
      <td valign="top">
          <pre>

@{ int x = 123; string 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>

Hi [email protected]

      <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')