How to use different syntax of underscore JS template engine?

Underscore JS template engine used to compile javascript template into such a function to render the content with HTML file.

Underscore JS uses different syntax to render content into HTML format.

Syntax of template method in underscore JS,

_.template(templateString, [settings])

There will be three different syntax underscore js used,

  1. <%= %> Interpolate HTML tag to normal text in result.
    var htmlContent = _.template('<h2><%= name %></h2>', { name: 'Rakesh' });
    //Output will be, Rakesh
  2. <%- %> Keep HTML tag in result.
    var htmlContent = _.template('<h2><%= name %></h2>', { name: 'Rakesh' });
    //Output is, <h2>Rakesh</h2>
  3. <% %> used to define logical conditions for the execute code.
    <% if (value > 0) { %>
      Execute code here.
    <% } %>

    You can use syntax based on your requirement.

How to define Require JS Plugin in Magento?

You can create Require JS plugin in Magento with text! as a suffix and pass HTML file path in the dependency of the define( ) method in javascript.

An Example of a text plugin in Magento,

'text!Jesadiya_Blog/template/plugin.html'

Continue reading “How to define Require JS Plugin in Magento?”

How to define knockout property as observable in Magento 2?

Magento uses knockout Javascript to enhance some of its native features. You must have to know about the Knockout observable feature to use it.

knockout observables are used to get track changes of the current view model property. if you want to subscribe to a change of your view model objects, you must define your property or objects as observable. Continue reading “How to define knockout property as observable in Magento 2?”