Sign in

Senior Frontend Engineer | Highly skilled in Angular, JavaScript, HTML, CSS

This article gives a brief overview of template literals in JavaScript and towards the end, we will see how we can use tagged templates to build a working translation function that is fun to use when we are dealing with static text that needs to be rendered in multiple languages.

What are Template Literals?

  1. Write multi-line string literals.
  2. Embed expressions in the string and have the JavaScript Runtime interpolate them for you. Interpolate or Interpolation is just a fancy word for the process of parsing a string with a bunch of placeholders and replacing the placeholders with their actual values.

Multi-line strings

const paragraphSimple =
"This is a very long paragraph. \n "…


This article will show you how you can write a customizable tree control using the power of angular templates and content projection.

Setup

export interface TreeItem {
children?: TreeItem[];
expanded?: boolean;
}

Lets build the template


This article shows you how to create an advanced structural directive similar to Angular’s own ngFor and use that to render a long list using progressive rendering concept.

Pre-requisites

Setup and brief structural directives refresher.

<ul>
<li *ngxtFor="
let item of longList;
itemsAtOnce: 500;
intervalLength: 50">
Item - {{item.id}}
</li>
</ul>

Sanjay Bhavnani

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store