Your SlideShare is downloading. ×
0

(function () {// ... vars and functions defined here are// local to this module// here you can also access global variable...
••••
<div class=“userEntry"><h1>{{username}}</h1><img>{{profilePic}}</img><div class=“status“>{{status}}</div></div>
<div class=“userEntry"><h1>{{username}}</h1><div class=“status“>{{{status}}}</div></div>
var context = {username: “Ivano“,profilePic: “./images/pic.png“,status: “feeling good”};
<script id=“user-template"type="text/x-handlebars-template">// template content</script>
var source = $("#user-template").html();var template = Handlebars.compile(source);
var context = {username: “Ivano“,status: “feeling good” };var html = template(context);<div class=“userEntry"><h1>Ivano<h1...
<h1>{{username}}</h1>
<h1>{{user.username}}</h1>
Handlebars.registerHelper(‘test‘, function(user) {return new Handlebars.SafeString("<a href=" + user.name + ">" +user.surn...
{{ test user }}
<div class="entry“><h1>{{title}}</h1>{{#with author}}<h2>By {{firstName}} {{lastName}}</h2>{{/with}}</div>{ title: "My fir...
<ul class="people_list">{{#each people}}<li>{{this}}</li>{{/each}}</ul>{ people: [ "Yehuda Katz", "Alan Johnson", "Charles...
<div class="entry">{{#if author}}<h1>{{firstName}} {{lastName}}</h1>{{else}}<h1>Unknown Author</h1>{{/if}}</div>
•••
RequireJS & Handlebars
RequireJS & Handlebars
RequireJS & Handlebars
RequireJS & Handlebars
RequireJS & Handlebars
RequireJS & Handlebars
RequireJS & Handlebars
RequireJS & Handlebars
RequireJS & Handlebars
RequireJS & Handlebars
RequireJS & Handlebars
RequireJS & Handlebars
RequireJS & Handlebars
RequireJS & Handlebars
RequireJS & Handlebars
RequireJS & Handlebars
RequireJS & Handlebars
RequireJS & Handlebars
RequireJS & Handlebars
RequireJS & Handlebars
RequireJS & Handlebars
RequireJS & Handlebars
Upcoming SlideShare
Loading in...5
×

RequireJS & Handlebars

6,543

Published on

RequireJS & Handlebars

This presentation has been developed in the context of the Mobile Applications Development course, DISIM, University of L'Aquila (Italy), Spring 2013.

http://www.ivanomalavolta.com

Published in: Technology, Travel

Transcript of "RequireJS & Handlebars"

  1. 1. 
  2. 2. (function () {// ... vars and functions defined here are// local to this module// here you can also access global variables}());
  3. 3. ••••
  4. 4. <div class=“userEntry"><h1>{{username}}</h1><img>{{profilePic}}</img><div class=“status“>{{status}}</div></div>
  5. 5. <div class=“userEntry"><h1>{{username}}</h1><div class=“status“>{{{status}}}</div></div>
  6. 6. var context = {username: “Ivano“,profilePic: “./images/pic.png“,status: “feeling good”};
  7. 7. <script id=“user-template"type="text/x-handlebars-template">// template content</script>
  8. 8. var source = $("#user-template").html();var template = Handlebars.compile(source);
  9. 9. var context = {username: “Ivano“,status: “feeling good” };var html = template(context);<div class=“userEntry"><h1>Ivano<h1><div class=“status“>feeling good</div></div>
  10. 10. <h1>{{username}}</h1>
  11. 11. <h1>{{user.username}}</h1>
  12. 12. Handlebars.registerHelper(‘test‘, function(user) {return new Handlebars.SafeString("<a href=" + user.name + ">" +user.surname + "</a>");});
  13. 13. {{ test user }}
  14. 14. <div class="entry“><h1>{{title}}</h1>{{#with author}}<h2>By {{firstName}} {{lastName}}</h2>{{/with}}</div>{ title: "My first post!",author: { firstName: "Charles", lastName: "Jolley" }}<div class="entry“><h1>My first post!</h1><h2>By Charles Jolley</h2></div>
  15. 15. <ul class="people_list">{{#each people}}<li>{{this}}</li>{{/each}}</ul>{ people: [ "Yehuda Katz", "Alan Johnson", "Charles Jolley" ] }<ul class="people_list"><li>Yehuda Katz</li><li>Alan Johnson</li><li>Charles Jolley</li></ul>
  16. 16. <div class="entry">{{#if author}}<h1>{{firstName}} {{lastName}}</h1>{{else}}<h1>Unknown Author</h1>{{/if}}</div>
  17. 17. •••
  1. A particular slide catching your eye?

    Clipping is a handy way to collect important slides you want to go back to later.

×