Directives

Angular supports three different types of directives. They are as follows:

• Components: Components are the most trivial type of directives. As described earlier in this chapter, components are classes annotated with the @Component decorator. They consist of metadata such as selector (name of the directive), the template or templateUrl (for the HTML syntax), and application logic used to process the form data. The following is a sample login directive of the type Component:

        import {Component} from '@angular/core';

        import { Login } from './login';

        @Component({
selector: 'login',
template: `<div>
        <form (ngSubmit)="onSubmit()" #loginForm="ngForm">
        <input type="email"
                       class="form-control"
                       id="email"
                       placeholder="Email"
                       [(ngModel)]="model.email"
                       name="email">
        <input type="password"
                    ...