Angular Core Concepts

An NgModule is a class decorated with @NgModule that organizes related components, directives, pipes, and services into a cohesive block of functionality. It declares which components belong to it, imports other modules it depends on, exports members for other modules to use, and registers providers for dependency injection. The root module, usually AppModule, bootstraps the application. While standalone components reduce the need for modules in newer Angular, NgModules remain a core organizing concept in many codebases.

A component is the fundamental UI building block in Angular. It is a class decorated with @Component that pairs application logic with an HTML template and optional styles, controlling a section of the screen called a view. The decorator defines a CSS selector so the component can be placed in other templates, plus its template and styling. Components expose properties and methods that the template binds to, and they participate in Angular's change detection to keep the view synchronized with the underlying data.

A service is a class that encapsulates reusable logic not tied to a specific view, such as fetching data, logging, or sharing state between components. Marking it with @Injectable lets Angular's dependency injection system create and supply it. Centralizing logic in services keeps components focused on the UI and promotes reuse and testability. Services are commonly provided at the root level so a single instance is shared application-wide, though they can also be scoped to particular modules or components.

Dependency injection (DI) is a design pattern in which a class declares what it needs and an external injector supplies those dependencies, instead of the class constructing them itself. In Angular you list dependencies as constructor parameters, and the framework's hierarchical injector resolves and provides the right instances. This decouples classes from concrete implementations, simplifies testing through mock providers, and lets you control instance lifetimes via provider scoping. DI is central to how Angular wires services into components.

An Observable from RxJS represents a stream of values delivered asynchronously over time. You subscribe to receive emitted values, errors, or a completion signal, and you can transform streams with operators like map, filter, and switchMap. Angular uses Observables extensively, for example the HttpClient returns one per request and EventEmitter builds on them. Remember to unsubscribe or use the async pipe to avoid memory leaks, since some Observables emit indefinitely.