Angular
Fundamentals of Angular Directives - Attribute Directives

ElementRef Exercise

Using the ElementRef class instance to access native elements

Exercise Goal

Make the buttons change the border from red to blue

Tasks

  1. Open the Exercise Problem stackblitz using the link below.
  2. In the ngOnInit() lifecycle method set the value of the el class instance variable to the nativeElement value that is available using the ElementRef class instance.

Exercise

Exercise Problem

Notes

  • The ElementRef class instance is already injected into the class as a private instance variable using the constructor() function.
  • When you click the "Red" button, the border color should be set to red, and when you click the "Blue" button, the border color should be set to blue.
  • Feel free to study and play with this first exercise!