This blog represents tips and code sample for using Template reference variable for capturing user inputs in an Angular form.
The following code represents the template file, app.component.html.
<div> <form> <div class="form-group"> <label for="emailField">Email address</label> <input type="email" class="form-control" id="emailField" #email (keyup)="setEmail(email.value)" placeholder="name@example.com"/> </div> </form> </div>
The following represents the component code, app.component.ts:
import { Component } from '@angular/core'; @Component({ templateUrl: './app.component.html', }) export class AppComponent { uEmail = ''; setEmail(value: string) { this.uEmail = value; } }
In case you are developing web apps using Spring and Angular, check out my book, Building web apps with Spring 5 and Angular. Grab your ebook today and get started.
Last updated: 15th May, 2024 Have you ever wondered how your bank decides what to…
In this fast-changing world, the ability to learn effectively is more valuable than ever. Whether…
Last updated: 13th May, 2024 Whether you are a researcher, data analyst, or data scientist,…
Last updated: 12th May, 2024 Data lakehouses are a relatively new concept in the data…
Last updated: 12th May 2024 In this blog, we get an overview of the machine…
Last updated: 12th May, 2024 In the world of generative AI models, autoencoders (AE) and…