Custom Directives
~20 mins
Task 1: Create Directive - highlight
ng g directive highlight
Task 2: Implement highlight directive logic.
- highlight.directive.ts
import { Directive } from '@angular/core';
@Directive({
selector: '[appHighlight]'
})
export class HighlightDirective {
constructor(el: ElementRef) {
el.nativeElement.style.backgroundColor = 'yellow';
}
}
<p appHighlight>Highlight me!</p>