Attribute directives

This category of directives is known for adding behavioral features to the DOM but not removing or adding any DOM content. Things such as changing appearance, showing or hiding elements, manipulating elements' attributes, and so on.

To better understand attribute directives, let's build some UI directives that are applied to component templates. These directives will change the behavior of the DOM when they are applied.

Create a new directive in a fresh project with the following command:

ng generate directive ui-button

This will create an empty directive in the app folder with the following content:

import { Directive } from '@angular/core';@Directive({  selector: '[appUiButton]'})export class UiButtonDirective { constructor() ...

Get TypeScript 2.x for Angular Developers now with O’Reilly online learning.

O’Reilly members experience live online training, plus books, videos, and digital content from 200+ publishers.