Building Web Apps with Spring 5 and Angular

Attribute directives

As defined earlier, attribute directives change the appearance or behavior of an element, component, or another directive. The following is an example of a trivial attribute directive setting the custom style for the element:

<div myStyle>Hello World!</div>

The next code snippet is an example of the aforementioned attribute directive, myStyle. Pay attention to the following in the code:

• The Decorator @Directive is used. 
• @Directive is passed metadata with the name of the directive assigned using the selector attribute. Pay attention to [,] used with the name.
• The class consists of logic for the directive.

import { Directive, ElementRef, Input } from '@angular/core';@Directive({ selector: '[myStyle]' }) export class ...