Declarations, imports, and exports in Angular - Cheat Sheet & Quick Revision

Recall & Review

beginner

What is the purpose of declarations in an Angular module?

Declarations list the components, directives, and pipes that belong to that module. They tell Angular what this module owns and can use internally.

beginner

Why do we use imports in an Angular module?

Imports bring in other Angular modules so you can use their exported components, directives, or pipes inside your module. It's like borrowing tools from a friend’s toolbox.

beginner

What does exports do in an Angular module?

Exports make components, directives, or pipes available to other modules that import this module. It’s like sharing your toys so others can play with them.

intermediate

Can a component be declared in more than one Angular module?

No, a component can only be declared in one module. Declaring it in multiple modules causes errors because Angular wouldn’t know which one owns it.

intermediate

How do imports and exports work together in Angular modules?

A module imports another module to use what it exports. The exporting module shares its components/directives/pipes, and the importing module can then use them inside its templates.

What should you put inside the declarations array of an Angular module?

A Components, directives, and pipes that belong to this module

B Other Angular modules to use

C Services to inject

D CSS stylesheets

Declarations are for components, directives, and pipes that the module owns.

If you want to use a component from another module, what must you do?

A Declare the component again in your module

B Import the module that exports that component

C Add the component to your exports array

D Nothing, Angular finds it automatically

You import the module that exports the component to use it.

What happens if you declare the same component in two different Angular modules?

A The component is ignored in the second module

B The component works in both modules

C Angular throws an error

D Angular merges the declarations

Angular does not allow a component to be declared in more than one module.

Which array in an Angular module controls what is shared with other modules?

A providers

B imports

C declarations

D exports

The exports array lists what this module shares with others.

To use Angular's built-in directives like *ngIf, what must you do?

A Import CommonModule in your module

B Declare NgIf in your declarations

C Export NgIf from your module

D Nothing, they are always available

CommonModule exports built-in directives like NgIf, so you must import it.

Explain how declarations, imports, and exports work together in Angular modules.

Think of declarations as what you own, imports as what you borrow, and exports as what you share.

Describe what happens if you forget to export a component you want to use in another module.

Sharing requires explicit export.