Component Directives

Component Directives are user-defined directives to extend the functionality and create small reusable functionalities.

Think of Component Directives as directives that have a template attached to them since Components Directives have their own view or template defined with them.

In previous chapters, we have created many components. If you have mastered the art of creating components and using them in our layouts, you will already know how to create Component Directives.

A quick recap on Angular components: components are small reusable pieces of code that we can use in throughout our applications.

In the following code snippet, we will see the basic syntax of the component. Create a file named my-template.component.ts:

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

@Component({
 selector: 'my-app',
 template: `<h2>{{ title }}</h2>...