Angular Interview Practice

How does Angular use directive selectors in templates?

1. By styling elements directly through HTML classes.

2. By modifying the DOM based on matching elements, attributes, or classes.

3. By creating new templates for each matching directive.

4. By implementing routing logic within the components.

The correct answer is: By modifying the DOM based on matching elements, attributes, or classes.

Angular utilizes directive selectors in templates primarily by modifying the Document Object Model (DOM) based on matching elements, attributes, or classes. When a directive is applied to an element in the template, Angular recognizes the selector defined for that directive. This can be in the form of an element name, an attribute, a class, or even a combination of these. Once the selector matches an element in the template, Angular invokes the associated directive's behavior, allowing it to manipulate the element or its children. This manipulation can involve altering the element's properties, adding or removing classes, or even dynamically generating additional DOM nodes or components as specified by the directive's logic. This mechanism ensures that Angular can extend the functionality and appearance of HTML elements seamlessly, providing developers with powerful tools to create rich and interactive applications. The other options focus on functionalities that are not directly related to how directive selectors work in Angular. For example, styling elements through HTML classes pertains more to CSS and does not encompass the broader capabilities of directives. Creating new templates relates to component templates rather than directive selectors themselves. Implementing routing logic is specifically handled by Angular's router and is separate from the role of directives, which focus on DOM manipulation rather than navigation.