I have
<input mdInput #try placeholder="Favorite food" value="Sushi">
and I get it in ts by
@ViewChild('try') myText : ElementRef;
and now I need to get approach to HtmlElement Function ,how I can Cast it?
and I don't want by this way
add id="try"
to mdInput
and get it by :
var cel= document.getElementById("try");
To manipulate the DOM using the ElementRef , we need to get the reference to the DOM element in the component/directive. Create a template reference variable for the element in the component/directive. Use the template variable to inject the element into component class using the ViewChild or ViewChildren.
You need to use renderer. setProperty() instead of renderer.
Angular ElementRef is a wrapper around a native element inside of a View. It's simply a class that wraps native DOM elements in the browser and allows you to work with the DOM by providing the nativeElement object which exposes all the methods and properties of the native elements.
You can get a handle to the DOM element via ElementRef by injecting it into your component's constructor: constructor(private myElement: ElementRef) { ... }
myText.nativeElement
will contain a reference to the DOM element. Assert myText.nativeElement
as HTMLElement
:
let domElement = this.myText.nativeElement as HTMLElement;
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