Web Age Solutions Inc
Providing Technology Training and Mentoring For Modern Technology Adoption
Web Age Aniversary Logo
US Inquiries / 1.877.517.6540
Canadian Inquiries / 1.877.812.8887
Course #:WA3076

Advanced Angular 12 Programming Training

Courseware: Available for sale

Take your Angular web apps to the next level with this Advanced Angular 12 Programming course.

Have you been using Angular at work for a while and want to take your skill to the next level? Then this Advanced Angular 12 course is for you. Our customers repeatedly told us about the challenges they are facing in their Angular projects. We have designed this course to directly address them.

This Advanced Angular 12 Training course will take you deeper into the platform. Our Advanced Angular training course gives experienced Angular developers more tools and techniques to improve the functionality and performance of their Angular projects.

Get started with Web Age Advanced Angular 12 Training today!

angular 12 training



Very good understanding of Angular.

About 6 months of experience using Angular is recommended

WA2988 Comprehensive Angular 10 Programming Training


2 days

Outline of Advanced Angular 12 Programming Training

Chapter 1. Advanced Component Concepts

  • Detecting Change to @Input Binding
  • Example Child and Parent Components
  • Using a Custom Setter
  • Using ngOnChanges
  • Advanced Inter Component Communication
  • Direct Access to Child
  • Using a Template Local Variable
  • Using the @ViewChild Decorator
  • Static and Dynamic Children with @ViewChild
  • More About @ViewChild
  • The @ViewChildren Decorator
  • Live Monitoring of Children
  • Direct Access to the Parent Component
  • Communication Using Subject API
  • Creating a Subject
  • Publishing a Message in a Subject
  • Subscribing to the Subject
  • Problem With Ordering
  • Content Projection
  • Setup Projection Using ng-content
  • Supplying Template for ng-content
  • The Host Element
  • Static Styling of the Host Element
  • Setting DOM Properties of the Host
  • Dynamically Loading a Component
  • Dynamic Loading Example
  • HostComponent Code
  • Setting entryComponents
  • Optimizing Change Detection
  • Example Excessive Template Execution
  • Using OnPush Change Detection Strategy
  • Properly Changing @Input Variables
  • Additional Notes on OnPush
  • Summary

Chapter 2. Advanced RxJS

  • Observable Creator Functions
  • Subscribing to DOM Events
  • The interval Function
  • forkJoin and zip Function
  • The concat Function
  • The merge Function
  • Recap of Operators
  • The debounceTime Operator
  • The distinct Operator
  • The delay Operator
  • The reduce Operator
  • The mergeMap Operator
  • The switchMap Operator
  • The retryWhen Operator
  • Basic Example of retryWhen
  • Retry for a Finite Time
  • Creating a Custom Operator
  • Advanced Example Custom Operator
  • Intercepting All HTTP Calls
  • Example Interceptor Service
  • Registering the Interceptor
  • Summary

Chapter 3. Custom Attribute Directive

  • Recapping Attribute Directives
  • Ways to Manipulate the Host Element
  • Binding to the DOM Properties of the Host
  • Listening for Host Events
  • Obtaining the DOM Event Object
  • Accessing the Host Component
  • Adding @Input to a Directive
  • Summary

Chapter 4. Custom Structural Directive

  • How Do Structural Directives Work?
  • Commonly Used API
  • A Very Simple Conditional Directive
  • Using the Sample Directive
  • Passing Context Data to the Template
  • Example Looping Directive
  • Using the Looping Directive
  • Summary

Chapter 5. Custom Validators

  • Validator for Reactive Forms
  • Example Validator Function
  • Using the Validator
  • Passing Data to Validator Function
  • Validator for Template Driven Forms
  • Example Validator Directive
  • Using the Validator Directive
  • Asynchronous Validator
  • Example Asynchronous Validator Function
  • Using the Validation Function
  • Asynchronous Validator Directive
  • Optimizing Asynchronous Validation
  • Summary

Chapter 6. Distributing Angular Libraries

  • Introduction
  • About Workspace and Project
  • Creating a Library Project
  • Anatomy of a Library Project
  • Create a Component in the Library
  • Create a Service in the Library
  • Building the Library
  • Distributing the Library
  • Using the Library from an Application
  • Using the Library Artifacts
  • Writing a Sample Application
  • Summary

Chapter 7. Internationalization (I18N)

  • Introduction to I18N
  • What Angular Provides
  • Add @angular/localize Package
  • Translatable Text
  • Extract Translatable Text
  • Example XLIFF File
  • Providing Translation
  • Configure the Build System
  • Building the Application
  • Deploying the Application
  • Custom Translation Unit ID
  • Getting the Current Locale
  • Translatable Attribute Text
  • Summary

Chapter 8. Security in Angular Applications

  • Overview of Authentication and Authorization
  • About Identity Token
  • Exchanging the Identity Token
  • Example Login Code in Angular Service
  • Options for Saving the Identity Token
  • Sending the Token to Server
  • Obtaining User Information
  • Cross Site Scripting (XSS) Attack
  • Angular and XSS
  • Sanitizing Content
  • Trusting HTML Content
  • Cross-Site Request Forgery (XSRF)
  • Preventing XSRF Using a Token
  • Summary

Lab Exercises

Lab 1. Advanced Inter Component Communication
Lab 2. Advanced Component Techniques
Lab 3. Using the Subject API
Lab 4. HTTP Client Warmup Exercise
Lab 5. Advanced RxJS
Lab 6. Developing a Custom Attribute Directive
Lab 7. Develop Custom Validators
Lab 8. Creating Angular Library
Lab 9. Using Angular Library
Lab 10. Angular Security – Authentication
Lab 11. Angular Security - Authorization

We regularly offer classes in these and other cities. Atlanta, Austin, Baltimore, Calgary, Chicago, Cleveland, Dallas, Denver, Detroit, Houston, Jacksonville, Miami, Montreal, New York City, Orlando, Ottawa, Philadelphia, Phoenix, Pittsburgh, Seattle, Toronto, Vancouver, Washington DC.
US Inquiries / 1.877.517.6540
Canadian Inquiries / 1.877.812.8887