Directives: Angular Directive is basically a class with a @Directive decorator. A component is also a directive-with-a-template. A @Component decorator is actually a @Directive decorator extended with template-oriented features. Whenever Angular renders a directive, it changes the DOM according to the instructions given by the directive. The directive appears within an element tag similar to attributes.
The Angular Directive can be classified into two types: structural and attribute directives.
Structural directives alter layout by adding, removing, and replacing elements in DOM. Attribute directive alter the appearance or behavior of an existing element.
Notice how when defining an Angular component we use the @component directive?
@Component({
selector: ‘main’,
template: `<child-dir #c=”child”></child-dir>`
})
class MainComponent { .. }