wonderful world
wonderful world

Reputation: 11599

What is <template> in angular2 and its use?

On the line 91 of this angular2 control, a special tag <template> is used. What is its use?

Upvotes: 1

Views: 62

Answers (1)

muetzerich
muetzerich

Reputation: 5720

Take a look on the angular docs:

Structural directives, like ngIf, do their magic by using the HTML 5 template tag.

What are structural directives?

A Structural directive changes the DOM layout by adding and removing DOM elements. We've seen three of the built-in structural directives in other chapters: ngIf, ngSwitch and ngFor.

What is the HTML 5 template element? Take a look here.

The HTML element is a mechanism for holding client-side content that is not to be rendered when a page is loaded but may subsequently be instantiated during runtime using JavaScript.

Example:

<p *ngIf="test.length > 0"><h1>Hello</h1></p>

the asterix * shows that it is a structural directive. The non-shorthand syntax for the example above is:

<template [ngIf]=”test.length > 0">
    <p>
       <h1>Hello</h1>
    </p>
</template>

So if the result of the expression is false, the element will be removed from the DOM.

Upvotes: 1

Related Questions