AngularJS Advance Course > Directives

How to Perform Custom Directive as a Attribute, Class and Comment

19k

  • Make a class using the @Directive attribute.
  • Assign the attribute directive name to the @Directive decorator's selector metadata.
  •  Change the appearance and behaviour of the host element by using the ElementRef class to access the DOM.

To make a custom directive, we must use the @Directive decorator instead of the @Component decorator. So, let's begin by making our first Custom Attribute directive. We'll use this directive to highlight the specified DOM element by changing its background colour. Create a highlight for your app.

  • Component is a template-based directive.
  • Structural directives - controls DOM elements, allowing us to add and delete items from the document. For example, *ngIf, *ngFor, and so on.
  • Attribute directives - to change an element's, component's, or directive's behaviour or appearance.

An element's class attribute defines one or more classnames. The class attribute is typically used to point to a style sheet class. It can, however, be utilised by JavaScript to make changes to HTML components with a defined class (through the HTML DOM).

A class attribute for an element defines one or more classnames. The class attribute is most commonly used to refer to a style sheet's class. It can, however, be used by JavaScript to modify HTML components with a defined class (through the HTML DOM).

Learner's Ratings

4

Overall Rating

  • 64%
  • 16%
  • 2%
  • 11%
  • 7%

Reviews

N
NAVNEET MAHESWARI
5

EASY TO LEARN

P
Prabhat Yadav
5

Amazing course content and easy to understand.

A
Aparna K
5

Excellent

R
Rambo Krish
5

sds

S
Shraddha Naik
5

Good

K
Kijima
5

Very good

L
LAXMAN GOVIND RATHOD
5

The Advanced AngularJS Course was good and included all the topics to find a good job in my City.

V
V.phanindra babu
4

The Advanced AngularJS Course was good and included all the topics to find a good job in my City.

P
Prakriti
4

The Advanced AngularJS Course was good and included all the topics to find a good job in my City.

V
Virender morya
5

Hello

Show More
Recommended Courses
Course Content

  1. What is AngularJS
    4m 35s
  2. How to use LearnVern
    3m 20s
  3. How to implement AngularJS
    9m 35s

  1. What is Scope Data-Binding and expression in AngularJS
    7m 37s
  2. How to use Scope,Data-Binding & expression with Example
    8m 56s

  1. What is Directive and types of Directives in AngularJS
    8m 41s
  2. How to work with Pre-defined Directive
    7m 5s
  3. How to work with Custom Directives
    7m 42s
  4. How to Perform Custom Directive as a Attribute, Class and Comment
    4m 9s
  5. Assignment of Directive
    1m 32s

  1. What is Controller and How to use in AngularJS
    5m 39s
  2. How to use controllers
    5m 39s
  3. How to use controllers child and parent
    13m 57s
  4. Assignment of Controller
    55s

  1. What is Event in AngularJS
    4m 20s
  2. Describe Events
    12m 23s
  3. How to Perform Event Emit Example in AngularJS
    14m 24s
  4. Assignment of Events
    49s
  5. How to Perform Event Broadcast Example in AngularJS
    8m 58s

  1. What is Routing in AngularJS
    9m 57s
  2. How to perform basic routing
    12m 3s
  3. How to use template URL in basic routing
    10m 27s
  4. Assignment of Routing
    5m 1s

  1. What is Service in AngularJS
    5m 57s
  2. Inbuilt services($timeout & $interval)
    12m 40s
  3. Inbuilt services($log service)
    12m 27s
  4. How to use factory services
    5m 53s
  5. How to use http service
    12m 24s
  6. How to use value and constant service
    10m 18s
  7. Assignment of Services
    2m 20s

  1. What are the Filters in AngularJS
    10m 53s
  2. How to use Inbuilt Filters
    10m 2s
  3. How to Create Custom Filters
    12m 42s
  4. Assignment of Fliter
    2m 27s

  1. What is Validation
    15m 33s
  2. How to use $touched and $untouched states
    13m 47s
  3. How to use $valid , $dirty and $pristine validation
    14m 38s
  4. How to perform validation through the class
    52m 8s
  5. How to perform validation through the directives
    3m 23s
  6. Assignment of Validation
    1m 20s
Enroll For Free