What you will learn in Pro Angular 16
Chapter by chapter
Concepts explained in this book
- component templateAn Angular component template is an HTML-based view definition associated with a component, containing Angular expressions and bindings that define rendered content.
- template variableA template reference variable is an Angular template variable that refers to a template element or directive instance.
- union typeA union type is a TypeScript type that permits a value to belong to one of several specified types.
- property bindingA property binding is Angular template syntax that assigns the result of an expression to a property of the object representing a host element.
- data sourceA data source is a component that supplies application data independently of where that data originates.
- componentA component is a modular application building block that encapsulates a portion of user-interface structure and behavior.
- serviceAn Angular service is a class that provides reusable application functionality and can be supplied through dependency injection.
- Angular moduleA feature module is an Angular module that groups the components, services, and dependencies associated with a particular application feature.
- routingRouter is the Angular service that performs programmatic navigation among application routes.
- any typeThe TypeScript any type permits a value to have any type and largely disables static type checking for that value.
- web formAn HTML form is a document element that groups interactive controls for collecting and submitting user-entered data.
- ngFor bindingngFor is Angular's built-in structural directive that repeats an HTML element for each item in an iterable collection.
- validationData validation is the process of checking input data against specified rules for correctness, completeness, or acceptability.
- FormControlFormControl is an Angular class that represents an individual form control's value, validation state, and interaction state.
- dependency injectionDependency injection is a technique in which a framework supplies an object's required dependencies rather than the object constructing them directly.
- routing configurationA routing configuration is a set of rules that maps URLs to components or other navigation outcomes in an Angular application.
- two-way bindingTwo-way data binding is a technique that synchronizes changes between application data and its user-interface representation in both directions.
- declarations propertyThe declarations property is Angular module metadata listing the components, directives, and pipes belonging to an Angular module.
- signalAn Angular signal is a reactive value abstraction that represents data and tracks relationships so dependent values can update efficiently when the data changes.
- directiveAn Angular directive is a class or construct that changes the behavior or presentation of an HTML element to which it is applied.
- data bindingData binding is a technique that connects application data with a user-interface representation so changes can be reflected between them.
- micro-templateA micro-template directive is an Angular directive whose shorthand syntax expands into an embedded template representation.
- event bindingAn event binding is Angular template syntax that associates a user-interface event with an expression or component method.
- type hintsA type annotation is explicit syntax that declares the type or permitted types of a variable or other program element.
- moduleA module is a self-contained software unit that groups related functionality and can be incorporated into an application.
- AngularAngular development tools build Angular applications and provide a local server for testing them in a browser.
- ActivatedRouteSnapshotActivatedRouteSnapshot is an Angular class representing the state of an activated route at a particular point during navigation, including captured parameters.
- route guardA route guard is an Angular service or class that controls whether navigation to a route or loading of a route module may proceed.
- truthinessA truthy value is a JavaScript value that evaluates as true in a Boolean context.
- component decoratorThe Angular component decorator attaches component metadata to a class so Angular can treat it as a component.
- selector propertyAn Angular directive selector is metadata that specifies which elements or attributes cause a directive to be applied.
- shadow hostA host element is the HTML element affected by an Angular binding through changes to its appearance, content, or behavior.
- ngSubmitAn ngSubmit binding is Angular template syntax that invokes an expression or component method when a form is submitted.
- TypeScript compilerThe TypeScript compiler checks TypeScript source and emits JavaScript output without retaining TypeScript-only type annotations in the generated JavaScript.
- hydrationRehydration is the process of attaching client-side application behavior to server-generated HTML after the JavaScript required to run that behavior has downloaded.
- template expressionAn Angular template expression is a fragment of code evaluated against component context whose value contributes to a binding or rendered content.
- structural directiveA structural directive is an Angular directive that changes the rendered document structure by creating, removing, or repeating template content.
- computed signalThe computed function is an Angular API function that creates a read-only signal from a derivation function whose signal reads establish its dependencies.
- injectable decoratorThe injectable decorator is an Angular decorator that marks a class for use as an injectable service.
- providers propertyThe providers property of Angular module metadata lists services and other objects made available through Angular dependency injection.
- class bindingA special class binding is Angular syntax that independently controls whether a named CSS class is present on an element.
- ngClassngClass is an Angular directive that manages CSS class memberships on an element from a bound expression.
- form apiThe reactive forms API is Angular's programming interface for representing and managing forms through explicit form-control objects and model-driven state.
- import statementAn import statement is JavaScript or TypeScript syntax that declares a dependency on another module and makes its exported declarations available in the current module.
- change detectionChange detection is Angular's process for detecting changes in application state and updating affected views.
- data modelA data model is a representation of the entities, properties, and relationships in an application's domain.
- Angular MaterialAngular Material is a library of UI components and styles for Angular applications that implements Material Design principles.
- indexingAn array index is a numeric position used to access an element in an array.
- route resolverA route resolver is an Angular routing mechanism that performs prerequisite work, such as loading data, before navigation completes.
- external templateAn external template is an Angular component template stored in a separate HTML file from the component class.
- JavaScriptJavaScript is a programming language commonly used to implement behavior in web pages and client-side applications.
- nullish coalescing operatorThe nullish coalescing operator returns its right operand only when its left operand is null or undefined.
- MinLength attributeA minlength validator is an Angular form validator that marks a control invalid when its string value is shorter than a specified minimum length.
- formarrayFormArray is an Angular forms class that represents an ordered collection of form controls and manages their values and state by array position.
- observableAn observable is a reactive abstraction representing a sequence of values that can be emitted asynchronously over time.
- unidirectional data pipelineOne-way data binding is a technique in which data flows from an application value or source to a user-interface representation in a single direction.
- ngDoCheckngDoCheck is an Angular component lifecycle method that runs during change detection to support custom checking of state changes.
- trackBytrackBy is an Angular ngFor configuration that identifies equivalent items by the result of a comparison function.
- constructor methodA constructor is a class member that initializes an instance when the class is instantiated.
- ng serveng serve is an Angular CLI command that builds an Angular application and serves it through a development server.
- pipeA built-in Angular pipe is a pipe implementation provided by Angular for common data-transformation and formatting tasks.
- impure pipeAn impure pipe is an Angular pipe whose transform method may be called during every change-detection cycle because its output can change independently of its input reference.
- content projectionContent projection is an Angular technique that inserts content from a component's host element into the component's template.
- ng-contentng-content is Angular template syntax that marks where a component's host-element content is projected into its template.
- eventA browser event is an object representing an occurrence that can provide information to event handlers about the occurrence and its source.
- as operatorA type assertion is TypeScript syntax that tells the compiler to treat an expression as a specified type without changing the runtime value.
- routerLink directiverouterLink is an Angular directive that associates an HTML element with a navigation route and navigates when the element is activated.
- bundlingBundling is the process of consolidating compiled application modules and their resources into distributable files.
- imports propertyThe imports property is Angular module metadata containing the modules whose exported features are available to an Angular module.
- pure pipeThe pure decorator property is Angular pipe metadata that specifies whether a pipe runs only when its input or arguments change or on every change-detection cycle.
- repository patternA repository is an abstraction that mediates access to data while hiding how that data is obtained from application components.
- route parameterA route parameter is a value supplied through a URL at runtime and made available to the route's navigation or component logic.
- root moduleA root module is the Angular module that describes an application to Angular, including its required modules, providers, declarations, and root component configuration.
- code reloadingHot reload is a development technique that updates a running application after source changes without requiring a full restart.
- text boxHTMLInputElement is the DOM interface representing an HTML input element and exposing its input-specific properties and behavior.
- ngOnChangesngOnChanges is an Angular lifecycle hook method invoked before initialization and whenever a directive or component input property changes.
- angular compilerThe Angular compiler transforms Angular application source and templates into executable browser-oriented output.
- root componentA root component is the top-level Angular component responsible for managing the content presented at the application’s root element.
- ng-template elementAn ng-template element is an Angular template element that defines content for deferred or repeated instantiation without itself being rendered as an HTML element.
- collection modificationA collection-level data change is an addition, removal, or replacement of an object within a collection.
- forEachAddedItemforEachAddedItem is an Angular iterable-changes method that invokes a callback for each item added to a collection.
- forEachRemovedItemforEachRemovedItem is an Angular iterable-changes method that invokes a callback for each item removed from a collection.
- IterableChangeRecordIterableChangeRecord is an Angular data object describing an item and its positional or identity change in an iterable collection.
- IterableChangesIterableChanges is an Angular API object containing the records and operations needed to process changes detected in an iterable collection.
- IterableDifferIterableDiffer is an Angular API object that compares an iterable collection with its previous state and reports changes.
- IterableDiffer.diffIterableDiffer.diff is an Angular API method that compares a collection and returns its detected changes or null when none exist.
- IterableDifferFactoryIterableDifferFactory is an Angular API class that creates an iterable differ for a supported collection.
- IterableDiffersIterableDiffers is an Angular service that locates factories capable of comparing iterable collections for changes.
- trackByIdtrackById is an Angular iterable-change-record property containing the identity value used to associate a collection item with its view.
- ViewRefViewRef is an Angular API object representing an embedded view that can be managed by a view container.
- runtime errorA runtime error is a failure that occurs while a program is executing rather than while its source is being compiled.
- angular.jsonangular.json is the Angular workspace configuration file that defines project settings and command configurations.
- canActivateChild methodThe canActivateChild method is a guard method that determines whether a child route may be activated.
- canDeactivate methodThe canDeactivate method is a guard method that determines whether a component may be deactivated during navigation.
- canDeactivate propertyThe canDeactivate property is Angular route configuration that associates a route with one or more deactivation guards.
- child route guardA child route guard is a guard that controls activation of the child routes belonging to a parent route.
- mapToCanActivatemapToCanActivate is an Angular function that converts classes defining canActivate into functional route guards.
- mapToCanActivateChildmapToCanActivateChild is an Angular function that converts classes defining canActivateChild into functional child-route guards.
- route deactivation guardA route deactivation guard is an Angular guard that determines whether the currently displayed component may be left during navigation.
- RouterStateSnapshotRouterStateSnapshot is an Angular route-information object that represents the router state for a navigation, including its URL.
- unsaved editsUnsaved edits are modifications to application data that have not yet been persisted.
- validation ruleA validation rule is a condition that input data must satisfy to be considered valid.
- errors propertyThe errors property is an Angular form-control property that contains details of the validation failures currently affecting the control.
- ngControlngControl is an Angular directive that registers an HTML form control with Angular's form validation system.
- pattern attributeThe pattern attribute is an HTML form-control attribute that requires entered text to match a specified regular expression pattern.
- validation stateValidation state is the current condition of form data relative to the validation rules applied to it.
- square bracket binding syntaxSquare bracket binding syntax is Angular template notation that marks a binding as one-way and supplies an evaluated expression to its target.
- createComponentcreateComponent is a ViewContainerRef method that creates an Angular component dynamically at a view-container location.
- WritableSignal<T>A writable signal is an Angular signal whose value can be changed directly through writable operations.
- ngModelngModel is an Angular directive that binds a form control's value to an application model.
- inputAn input property is a directive or component property that receives a value from a template binding.
- packageA package is a distributable software unit containing code and metadata that can be installed as a dependency.
- TypeScriptTypeScript is a statically typed programming language that extends JavaScript with additional language features and compiles to JavaScript.
- matCellDefThe matCellDef directive marks an Angular Material table template element as defining the contents of a data cell.
- output propertyAn output property is a directive or component property that exposes an event through which it can emit values to its parent template.
- server-side renderingServer-side rendering is the technique of executing an application on a server to generate HTML that is sent to a browser before client-side code is ready.
- providerA class provider is Angular dependency-injection configuration that maps a token to a class implementation.
- BootstrapBootstrap is an open-source front-end library providing CSS styles and interface components for responsive web pages and applications.
- view containerA view container is an Angular-managed location that holds and manages a collection of rendered views.
- data conversionType coercion is the implicit conversion of a value from one data type to another during an operation or comparison.
- equalityThe JavaScript identity operator compares operands without type coercion and requires their values and types to match.
- conditional logicAn if/else statement conditionally selects one of two alternative blocks of code.
- logical ORThe logical OR operator is a JavaScript operator that returns its left operand when truthy and otherwise returns its right operand.
- Number functionThe Number function converts its argument to a JavaScript numeric value.
- operator precedenceOperator precedence is the rule determining the order in which operators in an expression are evaluated.
- optional chainingThe optional chaining operator conditionally accesses a property or invokes a method, yielding undefined when the preceding value is null or undefined.
- styles bundleA styles bundle is a generated JavaScript bundle containing the stylesheets and code needed to apply application styles in the browser.
- templateUrl propertyThe templateUrl property is component metadata specifying the file that contains a component's template.
- WebpackWebpack is a JavaScript module bundler that analyzes module dependencies and produces bundles for application delivery.
- value propertyThe value property is the DOM property containing the current value of a form control such as an input element.
- testA unit test is an individual test that checks the behavior of an isolated software unit.
- private memberThe private keyword restricts a class member's access to the class that defines it.
- NgFormNgForm is an Angular directive and form controller that tracks an HTML form's controls, values, and validation state.
- arrow functionAn arrow function is JavaScript function syntax with lexical this binding and a concise expression form.
- context objectA context object is an object whose properties provide values available to bindings in an instantiated Angular template.
- input eventInputEvent is a DOM event interface describing an input-related change to editable or form-control content.
- classA JavaScript class is a language construct that defines the structure and behavior of objects and provides a basis for creating instances.
- methodA method is a function defined as part of a class or object and invoked through that class or object.
- stringA string is a JavaScript primitive value representing a sequence of characters.
- createEmbeddedViewcreateEmbeddedView is an Angular view-container operation that instantiates an embedded view from a template and context object.
- TemplateRefTemplateRef is an Angular object representing a template that can be instantiated as one or more embedded views.
- ViewContainerRefViewContainerRef is an Angular class that provides operations for creating, inserting, removing, and managing views in a view container.
- mat-table attributeThe Angular Material table component is an Angular UI component for rendering tabular data with configurable columns, headers, and rows.
- npm scriptThe scripts section is the package.json field containing named command definitions that a package manager can execute.
- bindToComponentInputsbindToComponentInputs is an Angular router configuration option that enables route values to be assigned to component input properties.
- optional segmentAn optional route parameter is a route value that may be included in a URL to provide additional information without being required for the route to function.
- URL matrix notationURL matrix notation is a URL convention that represents optional parameter values as semicolon-separated name-value pairs within a path segment.
- prerenderingPrerendering is the generation of an application's HTML documents before they are sent to browsers, before client-side JavaScript executes.
- Angular applicationAn Angular application is a web application built with the Angular framework.
- invalid propertyThe invalid property of an Angular form or control indicates whether its current value fails one or more validators.
- development dependencyThe devDependencies property is an npm manifest field listing packages required during development but excluded from the finished application.
- @HostBindingA host binding is an Angular binding that connects a directive or component value to a property, attribute, class, or style of its host element.
- matHeaderCellDefThe matHeaderCellDef directive marks an Angular Material table template element as defining the contents of a header cell.
- lintingA linter is a static-analysis tool that examines source code for programming errors, style violations, and other rule-defined issues.
- color paletteA color palette is a defined collection of colors from which interface colors are selected.
- FormGroupFormGroup is an Angular reactive-forms class that aggregates named form controls and exposes their combined value and status.
- web serviceA web service is a network-accessible software service that provides data or operations to clients through web protocols.
- package managerA package manager is software that resolves, downloads, installs, and manages software packages and their dependencies.
- even valueAn even value is a boolean contextual value indicating whether an item occupies an even position in an Angular repeated sequence.
- paginationPagination is a technique for dividing a collection of results into separate pages or subsets for presentation or retrieval.
- differA differ is a change-comparison mechanism that detects additions, removals, or moves in a data structure.
- resolve methodA resolve method is a resolver operation that returns a synchronous value, observable, or promise whose completion controls route activation.
- resolve propertyThe resolve property is an Angular route configuration property that associates names with resolver functions whose results are obtained before route activation.
- authenticationAuthentication is the process of verifying the identity of a user or other entity requesting access to a system.
- entry pointAn entry point is the initial source module from which a build tool discovers an application's dependency graph.
- exports propertyThe exports property is Angular module metadata listing declarations or imported features made available to other Angular modules.
- http-server modulehttp-server is an npm package and command-line tool that serves static files over HTTP.
- direct navigationDirect navigation is entering or requesting an application URL directly rather than reaching it through in-application navigation.
- RouterModule.forChildRouterModule.forChild is an Angular API method that creates router configuration for routes declared by a feature module without providing the root routing service.
- CSSCSS is the stylesheet language used to describe the presentation of structured documents, including web pages.
- attributeAn object property is a named value or function associated with a JavaScript object.
- host listener@HostListener is an Angular decorator that binds a directive or component method to an event on its host element.
- TestBedTestBed is an Angular testing utility that configures a simulated application environment and creates objects for component tests.
- dynamically loaded moduleA dynamically loaded module is an application module whose code is loaded on demand when navigation reaches a route that requires it.
- read-only signalThe asReadonly method creates a read-only view of a writable Angular signal.
- dirty propertyng-dirty is an Angular CSS class applied to a form control after its value has been changed by the user.
- MVC modelA model class is a class that defines the structure and data properties of an entity in an application's data model.
- SassSCSS is a CSS-compatible stylesheet syntax that supports Sass features such as variables, functions, and nesting.
- mat-button directiveThe Angular Material button directive is a directive that applies Angular Material button styling and behavior to button or anchor elements.
- @NgModule decoratorThe @NgModule decorator attaches Angular module metadata to a class, including its declarations, imports, providers, and bootstrap configuration.
- UI libraryA component library is a reusable collection of user-interface components for application development.
- view encapsulationView encapsulation is Angular's mechanism for scoping component styles and, when applicable, rewriting their selectors to isolate them from other components.
- @Input decoratorThe @Input decorator marks a directive or component property as receiving a value from a template binding and can specify its attribute name.
- custom validator functionA custom validator is application-defined validation logic that determines whether form-control data satisfies a specified condition.
- HTTP clientHttpClient is an Angular service for making HTTP requests and receiving asynchronous responses.
- optional function argumentAn optional parameter is a function parameter that may be omitted when the function is called.
- import/export syntaxAn export statement is JavaScript or TypeScript module syntax that makes declarations available to importing modules, including through re-exported modules.
- localeA locale setting is an application configuration that determines locale-sensitive formatting conventions such as number punctuation and currency-symbol placement.
- implicit valueThe $implicit property is the default value property on an Angular template context object for a structural directive.
- attribute directiveAn attribute directive is an Angular directive that changes the behavior or presentation of an existing HTML element without changing the document structure.
- child routeA child route is a route defined as a descendant of another route in a nested Angular routing configuration.
- router-outletrouter-outlet is an Angular directive element that marks where the component for the current route is rendered.
- subscribeThe subscribe method registers callbacks or an observer with an observable to receive notifications for emitted values and other sequence events.
- ComponentFixtureComponentFixture is an Angular testing API object that provides access to a component instance, its rendered view, and change-detection operations.
- mat-sort-headerThe mat-sort-header attribute makes a table header participate in Angular Material sorting.
- mat-text-columnA mat-text-column element is an Angular Material table element that displays a data property as an unmodified text column.
- matColumnDefThe matColumnDef attribute identifies an Angular Material table column definition applied to a container of header and data cells.
- MatPaginatorMatPaginator is an Angular Material component that displays controls for navigating through paginated data.
- matSortMatSort is an Angular Material directive that manages sorting state and behavior for sortable table data.
- row templateA row template is a table template that specifies which configured column names are rendered in a row.
- HTTP methodAn HTTP method is a standardized operation verb in HTTP that specifies the intended action for a request.
- @angular/core@angular/core is the Angular package that provides foundational framework functionality, including component support.
- decoratorA decorator is a language construct that attaches metadata or behavior to a class or other declaration.
- typeof operatorThe typeof operator is a JavaScript operator that returns a string identifying the type of its operand.
- controls propertyThe controls property of an Angular form controller exposes an object containing the individual controls in the form.
- resetForm methodThe resetForm method resets an Angular form controller's validation state and returns the form to its original pristine state.
- validation summaryA validation summary is a collected display of validation error messages for multiple controls in a form.
- component isolationComponent isolation is the separation of Angular components that prevents one component from directly sharing objects with another component.
- shared resourceA shared object is an object instance made available to multiple application components so they can access common state or behavior.
- accessor methodA getter is a class or object member that computes and returns a value when accessed as a property.
- string interpolation bindingA string interpolation binding is Angular template syntax that evaluates an expression and inserts its result into an HTML element's text content.
- Document Object ModelThe DOM API is the browser programming interface for creating, reading, and modifying nodes in a document object model.
- RouterModuleRouterModule is the Angular module that provides router functionality and directives for Angular applications.
- ActivatedRouteActivatedRoute is an Angular service that exposes information about the currently activated route to a component.
- define-palette functionThe Angular Material Sass define-palette function creates a named palette by selecting hues and assigning semantic color roles.
- define-typography-config functionThe Angular Material Sass define-typography-config function creates a typography configuration map from named text styles.
- foreground and background palettesForeground and background palettes are theme color collections that define colors for interface content and surfaces, including disabled controls.
- get-color-from-palette functionThe get-color-from-palette function is an Angular Material Sass theming function that retrieves a color from a palette with an optional opacity value.
- :host selectorThe :host selector is a CSS selector that targets the host element of an Angular component.
- typography configurationA typography configuration is a mapping of text-style names to font settings used by Angular Material components.
- @use expressionA Sass @use expression loads a Sass module and makes its variables, functions, and other members accessible through a namespace.
- attribute bindingAn attribute binding is Angular template syntax that assigns a data-bound value to an element attribute.
- RESTREST is an architectural approach for designing web services around resources, URLs, and HTTP operations.
- mutate methodThe mutate method changes a writable Angular signal based on its current value.
- ViewChild decoratorThe ViewChild decorator is an Angular decorator that queries a component's view for a matching child element or component.
- static typingStatic typing is a language feature in which declared or inferred types are checked before program execution and incompatible assignments can produce compiler errors.
- platform detection serviceA platform detection service is an application service that exposes whether execution is occurring on a server or in a browser.
- isPlatformServerisPlatformServer is an Angular function that determines whether an application is running on a server platform.
- PLATFORM_IDPLATFORM_ID is an Angular dependency-injection token representing the identifier of the platform on which an application runs.
- static HTML representationA static HTML representation is an HTML rendering of an application that can be served without dynamically executing the application first.
These guides are generated from the text of Manning books by Manning's knowledge graph and link to the sections they draw on. The full books are available on liveBook and at manning.com.
