What is an Angular module vs a standalone component?
Why Interviewers Ask This
This question tests conceptual clarity. Interviewers want to hear a precise, confident definition before moving to more complex Angular topics. It also reveals how well you can explain technical ideas to non-experts.
Answer
Angular has two paradigms for organizing code: NgModule-based and standalone. NgModule approach (traditional): components must be declared in an NgModule. To use another component, import its module. Modules bundle declarations, imports, exports, and providers together. Every component, directive, and pipe must belong to exactly one module. This provides clear boundaries but requires boilerplate. Standalone approach (Angular 14+): components, directives, and pipes can be "standalone" — they don't belong to an NgModule and directly declare their own dependencies. @Component({ standalone: true, selector: "app-profile", template: "...", imports: [CommonModule, RouterModule, MatButtonModule, UserCardComponent] }). The imports array in @Component replaces NgModule's imports — you import directly what you need. Benefits of standalone: (1) Less boilerplate (no module file); (2) Better tree-shaking (only import what you use); (3) Simpler lazy loading (load a component directly, not a module); (4) Clearer dependency graph; (5) Easier to understand component dependencies. Bootstrapping a standalone app: bootstrapApplication(AppComponent, { providers: [provideRouter(routes), provideHttpClient()] }). Migration: run ng generate @angular/core:standalone to automatically migrate NgModule components to standalone. Interoperability: standalone and module-based code work side by side — a standalone component can be declared in an NgModule, and a standalone component can import NgModules.
Common Mistake
Don't just define the term — demonstrate that you understand when to use it and when not to. Showing awareness of trade-offs is what separates average from strong Angular candidates.