Suggest an editImprove this articleRefine the answer for “What is a template variable (#var)?”. Your changes go to moderation before they’re published.Approval requiredContentWhat you’re changing🇺🇸EN🇺🇦UAPreviewTitle (EN)Short answer (EN)**A template variable (`#var`)** in Angular is a way to create a local reference to a DOM element or a component inside a template, to use its properties and methods. **Key point:** `#var` is visible only within the current template and is not accessible directly in the component's TypeScript code (for that, there is `@ViewChild`).Shown above the full answer for quick recall.Answer (EN)ImageIn Angular, a **template variable (**`#var`**)** is a way to **create a local reference to a DOM element or a component inside a template**, to use its properties and methods without passing data into the component. ## Main points 1. **Syntax**: ```html <input #usernameInput type="text"> <button (click)="logValue(usernameInput.value)">Show</button> ``` - `#usernameInput` is a local variable referencing the `<input>`. - It can be used to access `value`, `checked`, and other properties of the element. 2. **Can reference child components or directives**: ```html <child-component #childRef></child-component> <button (click)="childRef.doSomething()">Call method</button> ``` - `#childRef` references an instance of the `child-component`. - Allows calling methods and accessing the component's public properties. 3. **Scope**: - A template variable is visible **only within the current template** where it is declared. - Not accessible directly in the component's TypeScript code (for that, there is `@ViewChild`). In other words, `#var` is a **local reference to an element or component inside the template for direct interaction with it**.For the reviewerNote to the moderator (optional)Visible only to the moderator. Helps review go faster.