What are attribute directives?

Attribute directives are a way of changing the appearance or behaviour of a component or a native DOM element. Ideally, a directive should work in a way that is component agnostic and not bound to implementation details.

Angular has built-in attribute directives such as ngClass and ngStyle that work on any component or element.

What is ngClass?

The ngClass directive changes the class attribute that is bound to the component or element it’s attached to. ngClass binds to a key:value control object. Each key of the object is a CSS class name; its value is true if the class should be added, false if it should be removed.

What is ngStyle?

The ngStyle directive changes the style attribute that is bound to the component or element it’s attached to. This directive works in the same fashion as ngClass.