# Templates

In Angular, a template is a blueprint for a fragment of a user interface (UI). Templates are written in HTML, and special syntax can be used within a template to build on many of Angular's features.

Almost all HTML syntax is valid template syntax. However, because an Angular template is only a fragment of the UI, it does not include elements such as `<html>`, `<body>`, or `<base>`, and also to eliminate the risk of script injection attacks, it does not support the `<script>` element in templates.

## Template Statements

* Template statements are methods or properties that you can use in your HTML to respond to user events.&#x20;
* With template statements, your application can engage users through actions such as displaying dynamic content or submitting forms.
* Template statements are used with elements, components, or directives in response to events.

#### Syntax <a href="#syntax" id="syntax"></a>

* the parser for template statements differs from the parser for template expressions.&#x20;
* the template statements parser specifically supports both basic assignment (`=`) and chaining expressions with semicolons (`;`).
* The following JavaScript and template expression syntax is not allowed:
  * `new` keyword
  * operators such as `++` , `--` , `+=` , `-=` , `|` and `&`

## Binding

## Event Binding

* Event binding lets you listen for and respond to user actions such as keystrokes, mouse movements, clicks, and touches.

{% embed url="<https://angular.io/generated/images/guide/template-syntax/syntax-diagram.svg>" %}
event binding syntax
{% endembed %}

The event binding listens for the button's click events and calls the component's `onSave()` method whenever a click occurs.

## Two-way Binding

Use two-way binding to listen for events and update values simultaneously between parent and child components.

In two-way databinding, automatic synchronization of data happens between the Model and the View and changes is reflected in both components.&#x20;


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://dailyjournal.gitbook.io/notes/web-frameworks/angular/templates.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
