Cheat Sheet

Create new project with Angular CLI

Creating and Using a New Component

Using different types of Component Selector

Databinding in Angular

Databinding – String Interpolation

Databinding – Property Binding

Databinding – Passing and Using Data with Event Binding

Databinding – Two-Way-Databinding

Using ngIf to Output Data Conditionally on Angular

Styling Elements Dynamically with ngStyle on Angular

Applying CSS Classes Dynamically with ngClass on Angular

Outputting Lists with ngFor on Angular

Binding to Custom Properties of Components in Angular

Binding to Custom Events of Component in Angular

How to disable View (css) Encapsulation in Angular

Local References in Angular

Getting Access to the Template DOM with @ViewChild in Angular

Projecting Content into Components with ng-content

Understanding the Component Lifecycle in Angular

Getting Access to ng-content with @ContentChild in Angular

Creating an Attribute Directive

Using HostListener to Listen to Host Events when Creating Directive

Using HostBinding to Bind to Host Properties when Creating Directive

Binding to Directive Properties in Angular

Building a Structural Directive in Angular

Understanding ngSwitch in Angular

Creating a Logging Service in Angular

Injecting Services into Services in Angular

Using Services for Cross-Component Communication

Setting up and Loading Routes

Navigating with Router Links

Navigation with a relative URL

Styling Active Router Links

Navigating Programmatically

Using Relative Paths in Programmatic Navigation

Passing Parameters to Routes

Passing Query Parameters and Fragments

Setting up Child (Nested) Routes

Preserve query parameters and fragments across navigations

Redirecting and Wildcard Routes

Protecting Routes with canActivate

Protecting Child (Nested) Routes with canActivateChild

Controlling Navigation with canDeactivate

Passing Static Data to a Route

Prefetch Dynamic Data with the resolve Guard

Understanding Hash Location Strategies

Template-Driven (TD) vs Reactive Approach in Angular Forms

Creating the Form using Template in Angular Forms

Accessing the Form with @ViewChild in Angular Template-driven forms

Adding Validation to check User Input in Angular Template-driven forms

Set Default Values with ngModel Property Binding in Angular Template-driven forms

Using ngModel with Two-Way-Binding in Angular Template-driven forms

Grouping Form Controls in Angular Template-driven forms

Handling Radio Buttons in Angular Template-driven forms

Setting and Patching Form Values in Angular Template-driven forms

Using Form Data in Angular Template-driven forms

Resetting Forms in Angular Template-driven forms

Creating a Form in Angular using Reactive Forms

Adding Validation in Angular using Reactive Forms

Getting Access to Controls in Angular using Reactive Forms

Grouping Controls in Angular using Reactive Forms

Arrays of Form Controls in Angular using Reactive Forms

Creating Custom Validators in Angular using Reactive Forms

Error Codes in Angular using Reactive Forms

Creating a Custom Async Validator in Angular using Reactive Forms

Reacting to Status or Value Changes in Angular Template-driven forms

Setting and Patching Values in Angular Template-driven forms

Using Pipes

Parametrizing Pipes

Built-in pipes

Chaining Multiple Pipes

Creating a Custom Pipe

Parametrizing a Custom Pipe

Pure and Impure Pipes

Understanding the async Pipe

Post and Put Request with HttpClientModule

Adjusting Request Headers with HttpClientModule

Sending GET Requests with HttpClientModule

Using the async Pipe with HttpClientModule

Requesting non-JSON data with HttpClientModule

URL Parameters with HttpClientModule

Debouncing requests with HttpClientModule

Show progress with HttpClientModule

Modifying Http Requests with Interceptors

Modifying Http Responses with Interceptors

Introduction to Angular animations

Use ng-animate Library in Angular for Animation

Using Animation Callbacks

Animating entering and leaving a view

Using Keyframes for Animations

Grouping Transitions to run multiple animation steps in parallel

How to use AoT Compilation with the CLI

Install lodash with Angular

Detect window size using Angular

Route transition animations in Angular

Creating reusable animations

Find inner elements using query in Angular Animation

Allow Angular Server access from outside of localhost

How to change default port in Angular

Deploy Angular app to Express

gzip Angular files after build

Serve pre-gzipped Angular files in Express

Best approach for deploying Angular app in Express

Best approach for deploying Angular app in Spring Boot

Update Angular

Pass a parameter to routerLink

How to use moment.js library in Angular

Install ng2-charts in Angular

Providing a singleton service on Angular

Detect window size changes using RxJS debounce in Angular

Bind and Unbind event listener for elements in Angular

Add class to body and intercept DOM using Renderer2 in Angular

Detect scroll to bottom of html element in Angular

Turn angular app into a pwa

Running `ng build` in a specific directory using bash

Service Worker not working in Angular

Push Notifications with Angular & Express

Configure Status Bar in Progressive Web Apps

Use thousand separator in Angular with DecimalPipe

Loading data before components using Router resolver in Angular

Defining Custom Fonts With @font-face in Angular

Using ControlValueAccessor to Create Custom Form Controls in Angular

Lazy Loading Feature Modules in Angular

Sharing Modules in Angular

Dynamically switch RTL/LTR on Kendo UI for Angular

Reload the whole page in Angular

Using iframe in Angular

Access to HTML element using @ViewChild in Angular

Angular Component Inheritance

Reloading current route in Angular

Pass a value to the Resolver on Angular