Module

Template

Template

• The Template class provides a much nicer and clearer way of achieving this formatting.

• The templates consist of five types as described below

1) Straight forward templates

2) Templates are meant to be reused

3) Escape sequence

4) Custom syntaxes

5) Moduleindex

Straight forward templates• The Template class users a basic formatting syntax, • The templates are created from strings that have embedded symbols

in the form #{fieldName} that will be replaced by actual values when the template is applied (evaluated) to an object.

Examples;• // the template (our formatting expression)•   var myTemplate = new Template('The TV show #{title} was created

  by #{author}.');

•   // our data to be formatted by the template•  var show = {title: 'The Simpsons', author: 'Matt Groening', network: ‘

FOX' };

•   // let's format our data•   myTemplate.evaluate(show);•   // > The TV show The Simpsons was created by Matt Groening.

Templates are meant to be reused• The following example shows the template being used with a handful

of distinct objects. Example;• //creating a few similar objects

var conversion1 = {from: 'meters', to: 'feet', factor: 3.28};var conversion2 = {from: 'kilojoules', to: 'BTUs', factor: 0.9478};var conversion3 = {from: 'megabytes', to: 'gigabytes', factor: 1024};

 •  //the template  

var templ = new Template('Multiply by #{factor} to convert from #{from} to #{to}.');

•  //let's format each object[conversion1, conversion2, conversion3].each( function(conv){templ.evaluate(conv); });

•  // -> Multiply by 3.28 to convert from meters to feet.•  // -> Multiply by 0.9478 to convert from kilojoules to BTUs.•  // -> Multiply by 1024 to convert from megabytes to gigabytes.

Escape sequence

• For these situations there's an escape sequence - the backslash character ( \ .)

Example;  // note: you're seeing two backslashes here because the 

backslash is also a 

   // escaping character in JavaScript strings  var t = new Template('in #{lang} we also use the \#{variabl

syntax for templates.');  var data = {lang:'Ruby', variable: '(not used)'};  t.evaluate(data);

  // > in Ruby we also use the #{variable} syntax for templates

Custom syntaxes• The Template's constructor accepts an optional second argument

that is a regular expression object to match the replaceable symbols in the template string.

• The template that uses a syntax similar to the ubiquitous <%= %> constructs.

Example;

var syntax = /(^|.|\r|\n)(\<%=\s*(\w+)\s*%\>)/; //matches symbols like  '<%= field %>‘

    var t = new Template('<div>Name: <b><%= name %></b>, Age: <b> <%=age%></b></div>', syntax);

   t.evaluate( {name: 'John Smith', age: 26} );  // -> <div>Name: <b>John Smith</b>, Age: <b>26</b></div>

 

Moduleindex• evaluate(object) -> String• Applies the template to the given object’s data, producing a formatted string

with symbols replaced by corresponding object’s properties.Examples;

var hrefTemplate = new Template('/dir/showAll?lang=#{language}&categ=#{category}&lv=#{levels}');var selection = {category: 'books' , language: 'en-US'};

 hrefTemplate.evaluate(selection);

       // -> '/dir/showAll?lang=en-US&categ=books&lv=' 

hrefTemplate.evaluate({language: 'jp', levels: 3, created: '10/12/2005'});       // -> '/dir/showAll?lang=jp&categ=&lv=3' 

hrefTemplate.evaluate({});       // -> '/dir/showAll?lang=&categ=&lv=‘

hrefTemplate.evaluate(null);       // -> error !