Menu
To get started using template reference variables, simply create a new Angular component or visit an existing one. To create a template reference variable, locate the HTML element that you want to reference and then tag it like so: #myVarName .
We declare Template reference variables using # followed by the name of the variable ( #variable ). We can also declare them using #variable="customer" when the component/directive defines a customer as the exportAs Property.
Syntaxlink In the template, you use the hash symbol, # , to declare a template variable.
That is a use-case for @ViewChild:
https://angular.io/docs/ts/latest/api/core/index/ViewChild-decorator.html
class XComponent {
@ViewChild('ipt', { static: true }) input: ElementRef;
ngAfterViewInit() {
// this.input is NOW valid !!
}
somefunction() {
this.input.nativeElement......
}
}
Here's a working demo:
https://stackblitz.com/edit/angular-viewchilddemo?file=src%2Fapp%2Fapp.component.ts
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With