Angular 2: access an element from the Component, getDocumentById doesn't work
You can use @ViewChild with a div by adding a TemplateRef.
Template
<div id ="myId" #myId>
Component
import { Component, ViewChild, ElementRef, AfterViewInit } from '@angular/core'; @Component({ selector: 'app-root', templateUrl: './app.component.html', styleUrls: ['./app.component.css'] }) export class AppComponent implements AfterViewInit { @ViewChild('myId') myId: ElementRef; constructor() { } ngAfterViewInit() { console.log(this.myId.nativeElement); } }
This blog post by Kara Erickson is a really good read for getting familiar with the Angular approach to doing things like this.
Add Template Reference variable to the element you need access to:
<div #myDiv></div>
And in the component:
class MyComponent implements AfterViewInit { @ViewChild('myDiv') myDiv: ElementRef; constructor() {} ngAfterViewInit() { console.log(this.myDiv); }}