document getElementById replacement in angular4 typescript

Question

So  im working with angular4 in my practice work and this is new for me  Luckyly  in order to get html elements and its values i used   lt HTMLInputElement gt  document getElementById or   lt HTMLSelectElement gt  document getElementById  Im wondering if there is any replacement for this in angular

User · Answer

element  HTMLElement     constructor         fakeClick        this element   document getElementById  ButtonX   as HTMLElement      this element click

User · Answer

You can just inject the DOCUMENT token into the constructor and use the same functions on it  import   Inject    from   angular core   import   DOCUMENT   from   angular common      Component        export class AppCmp      constructor  Inject DOCUMENT  document          document getElementById  el             Or if the element you want to get is in that component  you can use template references

User · Answer

For Angular 8 or posterior  ViewChild have an additional parameter called opts  which have two properties  read and static  read is optional  You can use it like so           ViewChild  mydiv     static  false    public mydiv  ElementRef   constructor               lt div  mydiv gt  lt  div gt    NOTE  Static  false is not required anymore in Angular 9   just   static  true   when you are going to use that variable inside ngOnInit

User · Answer

You can tag your DOM element using  someTag  then get it with  ViewChild  someTag     See complete example   import  AfterViewInit  Component  ElementRef  ViewChild  from   angular core     Component       selector   app       template             lt div  myDiv gt Some text lt  div gt            export class AppComponent implements AfterViewInit        ViewChild  myDiv   myDiv  ElementRef       ngAfterViewInit             console log this myDiv nativeElement innerHTML             console log will print Some text

User · Answer

Try this   TypeScript file code     lt HTMLInputElement document getElementById  name    value  HTML code      lt input id  name  type  text   name

[angular] document.getElementById replacement in angular4 / typescript?

Examples related to angular

Examples related to typescript