Anil Singh | Code-sample.com

This is the other way to get the user data. It is also called #var. “A template reference variable is mostly a reference to a DOM element within a template. It can also be a reference to Angular components or directives and others.” It looks like this. < input  # name   placeholder = "Enter Name" > The following example shows to get user input from a template reference variable - template-reference.component.ts import  {  Component ,  OnInit  }  from   '@angular/core' ; @ Component ({    selector:   'app-template-reference' ,    templateUrl:   './template-reference.component.html' ,    styleUrls:  [ './template-reference.component.css' ] }) export   class   TemplateReferenceComponent   implements   OnInit  {    constructor () { }    ngOnInit () {    } } And template-reference.component.html – ...

Template Reference variable -  A template reference variable is a way of capturing a reference to a specific element, component , directive , and pipe so that it can be used someplace in the same  template HTML . You should declare a reference variable using the  hash symbol (#) . The Angular components and directives only match selectors for classes that are declared in the Angular module. Template Reference Variable Syntax  – You can use a template reference variable by two ways. 1.       Using hash symbol (#) 2.       Using reference symbol (ref-) The following examples of specifying a template reference variable using Input Text Box  – I have declared a reference variable “cellnumber” using the  hash symbol (#)  and  reference symbol (ref-) . < input   type = "text"   ref-cellnumber >  //cellnumber will be a template reference variable. And ...