0% found this document useful (0 votes)
773 views5 pages

Handlebars

Handlebars is a logic-less templating engine written entirely in JavaScript. It can be classified as a library and templates can contain HTML, text, and Handlebars expressions mixed together. Custom helpers can be created and registered in Handlebars to reuse code and build complex templates.
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as TXT, PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
773 views5 pages

Handlebars

Handlebars is a logic-less templating engine written entirely in JavaScript. It can be classified as a library and templates can contain HTML, text, and Handlebars expressions mixed together. Custom helpers can be created and registered in Handlebars to reuse code and build complex templates.
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as TXT, PDF, TXT or read online on Scribd
You are on page 1/ 5

Handlebars is a fully logic-less templating engine written entirely in JavaScript

False--correct

____________ is fully logic-less but ___________ adds minimal logic by using some
helpers such as if, with, unless, each and more.

Mustache,Handlebars--correct

Handlebars can be classified as a _____________.

Library--correct

How can you add reference of Handlebars in your project?

All of the options--correct

Handlebars.js is an extension to the _________________ templating language

Mustache--correct

Templates can contain HTML and text, mixed with Handlebars expressions

True--correct

Predict the output?

Hi {{name}}.
is used with the context variable:

var context = {
"name" : "<b>Jane Roe</b>"
}

<b>Jane Roe</b>--correct

Expression is a JavaScript object that you pass to the compiled template.

False--correct

The variables are written in double curly braces {{}} are known as
___________________

expressions--correct

//Create your context here with employees array with name and contact number array
var context={
"employees" : [{"name" : "John Doe" , "contact" : ["2368968930", "0987897301"]}]
};

$(document).ready(function() {
//retrieving the template `handlebars-template` from the HTML
var theTemplateScript = $("#handlebars-template").html();

//Compile the template using Handlebars.compile()


var theTemplate = Handlebars.compile(theTemplateScript);
//Pass the context as an argument to the compiled Template
var theCompiledHtml = theTemplate(context);

//insert the template-context package into '#content-placeholder'


$('#content-placeholder').html(theCompiledHtml);

});

//Custom helper 'studyStatus' which return 'Grade A/B/C/D' based on total_marks


Handlebars.registerHelper("studyStatus", function(total_marks) {
if(total_marks>500){
return "Grade A"
}else if(total_marks>400) {
return "Grade B"
}
else if(total_marks>300) {
return "Grade C"
}else if(total_marks>200) {
return "Grade D"
}
});

//Create your context here with students array with name and total_marks
var context = {
"students":[
{"name" : "John", "total_marks" : 505},
{"name" : "Doe" , "total_marks" : 205}
]
}

$(document).ready(function() {
//retrieving the template `handlebars-template` from the HTML
var theTemplateScript = $("#handlebars-template").html();

//Compile the template using Handlebars.compile()


var theTemplate = Handlebars.compile(theTemplateScript);

//Pass the context as an argument to the compiled Template


var theCompiledHtml = theTemplate(context);

//insert the template-context package into '#content-placeholder'


$('#content-placeholder').html(theCompiledHtml);

});

How can you create custom Helpers in Handlebars?

Handlebars.registerHelper()--correct

______________ are JS functions that you can call from your templates, and
encourage you to reuse code and build complex templates

Helpers--correct

Which helper iterates over each object in an array?


each--correct

The {{$ if}} helper allows you to implement an if condition block in your code.

False--correct

{{#each}}, {{#if}}, {{#unless}} are some of the __________ helpers .

Built-in--correct

//Create a custom helper, 'SayGreetings' which returns fullname +', Good morning\Go
eat lunch\Good afternoon!' based on current time
Handlebars.registerHelper('SayGreetings', function(fullname){
var currentYear=new Date().getHours();
var b;
if(currentYear==12){
b=fullname+", Go eat lunch"
}else if(currentYear<12){
b=fullname+", Good morning"
}
else if(currentYear>12){
b=fullname+", Good afternoon!"
}
return b

});

//Create a custom helper 'getFullName' which returns first_name+" "+last_name.


Handlebars.registerHelper('getFullName', function(first_name,last_name){
var a=first_name+" "+last_name;
return a
});

//Create your context here with user with properties first_name and last_name
var context = {
"user": {'first_name':'John','last_name':'doe'}
}

$(document).ready(function() {
//retrieving the template `handlebars-template` from the HTML
var theTemplateScript = $("#handlebars-template").html();

//Compile the template using Handlebars.compile()


var theTemplate = Handlebars.compile(theTemplateScript);

//Pass the context as an argument to the compiled Template


var theCompiledHtml = theTemplate(context);

//insert the template-context package into '#content-placeholder'


$('#content-placeholder').html(theCompiledHtml);

});

Subexpressions are delimited by ____________.

parentheses--correct
______________ allows you to invoke multiple helpers in a single mustache.

Subexpression--correct

In Subexpressions, the results of outer helpers will be passed as arguments to


inner helpers.

False--correct

How can you call the partial named customPartial in your template.

{{> customPartial }}--correct

How can you create partials in Handlebars?

Handlebars.registerPartial()--correct

With custom block helpers , we can change current context temporarily.

True

How do you add Templates in your HTML?

by including templates in <script> tags with type text/x-handlebars-template

How Handlebars.js is different from Mustache.js?

All of the options

____________ are tools to separate program-logic and presentation to generate


dynamic HTML.

Template engines--wrong

____________ is a JSON object that contains the values of variables used in the
template.

context

Handlebars allows you to write JavaScript directly within templates

True

The {{#unless}} helper is basically just the opposite of else condition.

True

Mustache is a fully logic-based templating engine that dynamically generates your


HTML view

True

In custom block helper, Handlebars automatically adds ____________ object as the


last parameter to the callback function.

options

How to add compiled template in your HTML page?


<script src="path/to/templatesCompiled.js"></script>

The {{#unless}} helper only outputs the contained block if the given expression is
true.

False

Each parameter in Helpers is a _______________.

Handlebars templates

You do not have permission to pass parameters to Helpers in Handlebars.

False

Do you need to use <script id="template-id" type="text/x-handlebars-template"> tag


in precompiled template?

No--correct

Mustache is a fully logic-based templating engine that dynamically generates your


HTML view.
true

You can improve the execution of the application if you precompile templateScript
and then send the compiled version to the customer.

True

handlebars-v2.0.0.js is lighter than handlebars.runtime.js


true

Options in custom block helper has a ________ method that allows you to change the
context of the object temporarily.

fn()

How can you write comments inside Handlebars templates

{{!TypeYourCommentHere}}

Precompilation increases _________________

All of the options

What should be the extension for the separate template file?

.handlebars

You might also like