0% completed

All LessonsFree Lessons (10)

First Steps

Introduction Setting Up

Our First Project

Creating an App Reviewing the Files Event Binding Property Binding Interpolation Global CSS Structural Directives Deploying the App Quiz Completed Project

Component Basics

Creating a New Project Understanding Components Creating a Component Passing Data From Parent to Child Component The ngFor Directive Static Assets Scoped CSS Quiz Completed Project

Pipes

Pipes Overview Pipe Basics Pipe Parameters Currency Pipe and Decimal Pipe JSON Pipe Custom Pipes Taking Things a Step Further Quiz Completed Project

Directives

Creating a New Project The ngClass Directive Toggling Images The ng-container Element The ngSwitch Directive Creating a New Directive Binding Properties to Directives Creating a Structural Directive Quiz Completed Project

Modules

Creating a New Project Exploring Modules Creating a Module Importing and Exporting Modules

Routing

The RouterOutlet Placeholder Creating More Routes The RouterLink Directive Active Link Styles Wildcard Routes Lazy Loading Modules The NgContent Directive Selecting Content Child Routes RouterLink Configuration

Advanced Components

Creating a Modal Problems With Modals Lifecycle Hooks Opening the Modal Emitting Events Reusable Modal Completed Project

Services

Creating a New Project Submitting the Form Generating Services Understanding Dependency Injection HTTP Requests Displaying the Results Highlighting Keywords Understanding XSS Attacks Inserting Raw HTML Tricky CSS

RxJS

Introduction to RxJS Observables Observers Pipes and Operators Avoiding Single Operators Handling Errors Creating Raw Observables Alternative Observer Syntax Unicast Observables Understanding RxJS in Our Application Using Generics With Observables Completed Project

Reactive Forms

Creating a New Project

Form Groups and Controls

Handling Validation

Form Controller Status

Reusing the Input

Wiring the Form

Quick Adjustment

Validating the Other Inputs

Resetting the Form

Completed Project

Template Forms

Creating a New Project The FormsModule Two-Way Data Binding Understanding Template Forms Validation Handling Form Submission Completed Project

Custom Validators

Creating a New Project Adding Routes Adding Reactive Forms Adding Validators Custom Validators Injecting Validators Asynchronous Validators Creating a Service Hashing a Password Handling the Response Using Async Validators Creating a Reusable Input Handling Errors

Authentication

Setting Up Firebase Configuring Firebase with Angular Registration Form Submission Creating a New Account Redirection After Creating an Account Handling Registration Errors Validating and Submitting the Login Form Authentication Authentication Persistence Toggling Menu Items Logging Out Router Guards Guarding Guest Routes Completed Project

Conclusion

Where To Go From Here?

Angular: Designing and Architecting Web Applications/

...

/

Forms Overview

Forms Overview

In this lesson, we'll learn about Angular's system for helping you develop forms.

We'll cover the following...

Forms play a significant role in any application. We saw how we could work with forms in Angular. We can use property binding and event handling on form inputs, which gives us control over the input.

This solution works fine for small applications. Angular provides two alternative features for controlling forms and their inputs. There are reactive forms and template ...