• Overview of ES5

• Installing Node and NPM

• JavaScript Basic Syntax

• Detailing on ES5 problems

• JavaScript project creation using NPM

• Introduction to TypeScript

• TypeScript Environment Setup

• Basic Syntax

• Types, Variables and Operators

• Decision Making and Loops

• Functions and Lambda Expressions

• Classes and Objects

• Inheritance and Interface

• Generics

• Enums

• Number and Strings

• Arrays

• Tuples and Union

• Namespaces and Modules

• Decorators

• Ambients

• Mixins

• Angular CLI

• Why Angular

• Angular Features

• Installing and Using Angular CLI

• Creating the first Angular Project

• Architecture Overview of Angular

• New in Latest Version

• Summary

• Introducing the component

• Component Decorator Properties

• Template

• Inline Template

• Interpolation – Plain text, Object and Array

• Adding CSS

• Component Starter

• Integrating Bootstrap

• Summary

• Binding Syntax

• One-Way Binding

• Interpolation

• Property binding

• Interpolation vs Property Binding

• Class binding, Style binding

• Attribute binding

• Setting Element Properties

• Binding Events

• Template Reference Variables

• Two-Way Binding of Input Fields

• Summary

• What is a Single Page Application (SPA)

• SPA Workflow

• Traditional Web Application Capabilities

• Single Page Application Advantages

• SPA and Traditional Web Sites

• SPA Challenges

• Implementing SPA's Using Angular 4

• Simple SPA Using Visibility Control

• SPA Using Angular Components

• SPA with Angular Components - Switching

• SPA with Angular Components - The Displayed Component

• Implement SPA Using an Angular Component Router

• Summary

• Pass data from parent to child with input binding

• Intercept input property changes with a setter

• Intercept input property changes with ngOnChanges()

• Parent interacts with a child via local variable.

• Parent calls an @ViewChild ()

• Parent and children communicate via a service.

• Introduction to Directives

• Directive Types

• Apply Styles using NgClass and NgStyle

• Applying Styles Directly

• Obsolete Directives and Property Binding

• Controlling Element Visibility

• Setting Image Source Dynamically

• Setting Hyperlink Source Dynamically

• Summary

• Adding and Removing Elements Dynamically

• Looping Using ngFor

• ngFor - Basic Syntax

• Creating Tables with ngFor

• ngFor Local Variables

• Swapping Elements with ngSwitch

• ngSwitch - Basic Syntax

• ngSwitch - Full Template Syntax

• Summary

• A Basic Angular Form

• Binding Input Fields

• Accessing the Form Object

• Binding the Form Submit Event

• The Submit Function

• Basic HTML5 Validation - "required" attribute.

• Angular Validators

• Angular Validation State

• Displaying Form Validation State

• Displaying Field Validation State

• Disabling Submit when Form is Invalid.

• Submitting the Form

• Binding to Object Variables

• Additional Input Types

• Checkboxes

• Select (drop down) Fields.

• Rendering Options for Select (drop down)

• Date fields

• Radio Buttons

• Summary

• Introduction

• Registering the reactive forms module

• Generating a new form control

• Registering the control

• Managing control values

• Grouping form controls

• Creating FormGroup

• Associating the FormGroup model and View

• Saving form data

• Displaying the component

• Creating nested form groups

• Grouping the nested form in the template

• Partial model updates

• Introduction to FormBuilder

• Generating form controls with FormBuilder

• Injecting the FormBuilder service

• Generating form controls

• Simple form validation

• Dynamic controls using form arrays.

• What are Pipes?

• Using a Built-in Pipe

• Chaining Pipes

• Some Pipe Examples

• Decimal Pipe, Currency Pipe

• Custom Pipes

• Using Custom Pipes

• A Filter Pipe

• A Sort Pipe

• Pipe Category: Pure and Impure

• Pure Pipe Example

• Impure Pipe Example

• Summary

• Routing and Navigation

• The Component Router

• Traditional Browser Navigation

• Component Router Terminology

• Setting up the Component Router

• Basic Navigation

• Programmatic Navigation

• Passing Data During Navigation

• Creating Routes with Route Parameters

• Navigating with Route Parameters

• Using Route Parameter Values

• Retrieving the Route Parameter Synchronously

• Retrieving the Route Parameter Asynchronously

• Query Parameters

• Summary

• What is a Service?

• Creating a Basic Service

• What is Dependency Injection?

• What Dependency Injection Looks Like

• Injecting Services

• Using a Service in a Component: Dedicated Instance

• Using OnInit to Initialize Component Data

• Using a Shared Service Instance

• Dependency Injection and @Host

• Dependency Injection and @Optional

• Summary

• What is an Observable?

• Observable Operators

• Creating Observables Using Static Operators

• What is an Observer?

• Subject

• Subject Example

• Event Emitter

• Subscription

• The Angular HTTP Client

• Importing Individual Providers into Services

• Service Using Http Client

• Service Imports

• What does an Observable Object do?

• Making a Basic HTTP GET Call

• Using the Service in a Component

• Importing Observable Methods

• Enhancing the Service with .map() and .catch()

• GET Request with Options

• POST Request

• Reading HTTP Response Headers

• Summary

• Understanding Core Module

• Feature Modules

• Shared Modules

• Lazy loading of modules

• Routes with Feature module

• Built-in Security contexts

• Using AOT Compilation

• Optimization and performance issues

• Auth Feature Module

• Cross module communication

• Protecting Lazy Loaded Routes

• Angular and i18n

• Setting up the locale of your app

• i18n pipes

• Template translations

• Mark text with the i18n attribute

• Help the translator with a description and meaning.

• Translate text without creating an element.

• Unit Testing Angular Artifacts

• Testing Tools

• Typical Testing Steps

• Test Results

• Jasmine Test Suites

• Jasmine Specs (Unit Tests)

• Expectations (Assertions)

• Matchers

• Examples of Using Matchers

• Using the not Property

• Setup and Teardown in Unit Test Suites

• Example of beforeEach and afterEach Functions

• Angular Test Module

• Example Angular Test Module

• Testing a Service

• Injecting a Service Instance

• Test a Synchronous Method

• Test an Asynchronous Method

• Using Mock HTTP Client

• Supplying Canned Response

• Testing a Component

• Component Test Module

• Creating a Component Instance

• The ComponentFixture Class

• Basic Component Tests

• The DebugElement Class

• Simulating User Interaction

• Summary