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 –
div class="event">
button #keydownVal (keydown)="0">button>
p>
{{keydownVal.value}}
p>
div>
For more detail kindly refer the link https://www.code-sample.com/2018/05/angular-6-7-documentation-and-examples.html