How to Inject Document in Angular
Sometimes we just need to directly work with the DOM directly. I find this particularly so when doing things like scrolling to an element. How do you correctly leverage the document object in Angular?
import { Inject } from '@angular/core';
import { DOCUMENT } from '@angular/common';@Component({...}) // could be a service too!
export class MyComponent {
constructor (@Inject(DOCUMENT) private document: Document) {}
}
That’s it. Now, why write an article on something so simple? For starters, the best way to learn something is to teach it. Done. In addition, I’ve been doing full-time Angular development since the early alphas of Angular 2. I consider myself a guru-level Angular developer. However, I’m honest enough to admit that I still don’t know everything. One of my team members pointed this out in a code review. So, I learned something new today! Thanks, Ananthan!
Angular is evolving constantly. New features are added all of the time. As a developer, I love that I’m still learning new things and getting new features from the Angular team.
Be open to learning from anyone, anytime.
EnterpriseNG 2021 is coming your way!
Get ready for our latest event baked out especially with the enterprise in mind. EnterpriseNG will feature global Angular stars, leaders, and community members alike, all eager to share presentations with a focus around 4 main pillars, including:
* Enterprise Monorepos
* Micro Frontends
* Runtime Performance
* Maintainability and Quality
EnterpriseNG will be held online this November 4th & 5th, 2021!
Get your tickets here: { will insert link }
