Summary
Explore the fundamental concepts and practical uses of Angular attribute directives. Learn how to create custom directives, manipulate element styles, handle events, and communicate with components using Input and Output properties to enhance your Angular applications.
By this point, we’ve learned a lot about attribute directives, including how to create custom ones. In this lesson, we’ll recap and summarize everything we learned about attribute directives.
Generate a file
To generate a file using Angular CLI, we use the following command:
ng generate directive app-avatar
Directive syntax
An empty directive class looks like this:
@Directive({
selector: '[appAvatar]'
})
export class AvatarDirective {
constructor() { }
}
Apply the directive
To use the directive, we need to apply it to a specific element in the Angular template, like ...