Part 2 Evalution of World Wide Web || Angular Tutorial for Beginners || @NehanthWorld
Angular Tutorial For Beginners
Angular Tutorial for Beginners: Learn Angular & TypeScript
Complete Angular 13,14,15,16,17 Course Step by Step
AngularJS tutorial for beginners
1. Introducing Angular
o What is Angular?
o Central Features of the Angular Framework
o Appropriate Use Cases
o Building Blocks of an Angular Application
o Basic Architecture of an Angular Application
o Installing and Using Angular
o Anatomy of an Angular Application
o Running the Application
2. Introduction to TypeScript
o TypeScript Syntax
o Programming Editors
o The Type System – Defining Variables
o The Type System – Defining Arrays
o Type in Functions
o Type Inference
o Defining Classes
o Class Methods
o Class Constructors
o Class Constructors – Alternate Form
o Interfaces
o Working with ES6 Modules
o Visibility Control
o var vs let
o Arrow Functions
o Arrow Function Compact Syntax
o Arrow Function and Caller Context
o Template Strings
o Generics in Class
o Generics in Function
3. Components
o What is a Component?
o An Example Component
o Creating a Component Using Angular CLI
o The Component Class
o The @Component Decorator
o Registering a Component to Its Module
o Component Template
o Using a Component
o Run the Application
o Component Hierarchy
o The Application Root Component
o The Bootstrap File
4. Component Templates
o Templates
o Template Location
o The Mustache {{ }} Syntax
o Setting DOM Element Properties
o Event Binding
o Expression Event Handler
o Prevent Default Handling
o Attribute Directives
o Apply Styles by Changing CSS Classes
o Example: ngClass
o Applying Styles Directly
o Structural Directives
o Conditionally Execute Template
o Example: ngIf
o Looping Using ngFor
o ngFor Local Variables
o Manipulating the Collection
o Example – Deleting an Item
o Item Tracking with ngFor
o Swapping Elements with ngSwitch
o Template Reference Variable
5. Inter Component Communication
o Communication Basics
o The Data Flow Architecture
o Preparing the Child to Receive Data
o Send Data from Parent
o More About Setting Properties
o Firing Event from a Component
o @Output () Example – Child Component
o @Output () Example – Parent Component
o Full Two-Way Binding
o Setting up Two Way Data Binding in Parent
6. Template Driven Forms
o Template Driven Forms
o Importing Forms Module
o Basic Approach
o Setting Up a Form
o Getting User Input
o Omitting ngForm Attribute
o Initialize the Form
o Two Way Data Binding
o Form Validation
o Angular Validators
o Displaying Validation State Using Classes
o Additional Input Types
o Checkboxes
o Select (Drop Down) Fields
o Rendering Options for Select (Drop Down)
o Date fields
o Radio Buttons
7. Reactive Forms
o Reactive Forms Overview
o The Building Blocks
o Import ReactiveFormsModule
o Construct a Form
o Design the Template
o FormControl Constructor
o Getting Form Values
o Setting Form Values
o The Synchronous Nature
o Subscribing to Input Changes
o Validation
o Built-In Validators
o Showing Validation Error
o Custom Validator
o Using a Custom Validator
8. Services and Dependency Injection
o What is a Service?
o Creating a Basic Service
o The Service Class
o What is Dependency Injection?
o Injecting a Service Instance
o Injectors
9. Pipes and Data Formatting
o What are Pipes?
o Built-In Pipes
o Using Pipes in HTML Template
o Chaining Pipes
o The number Pipe
o Currency Pipe
o Create a Custom Pipe
o Custom Pipe Example
o Using Custom Pipes
o Using a Pipe with ngFor
o A Filter Pipe
10. HTTP Client
o The Angular HTTP Client
o Using The HTTP Client – Overview
o Importing HttpClientModule
o Simple Example
o Service Using HttpClient
o ES6 Import Statements
o Making a GET Request
o What does an Observable Object do?
o Using the Service in a Component
o Error Handling
o Customizing Error Object with. catch ()
o Making a POST Request
o Making a PUT Request
o Making a DELETE Request
11. The Angular Component Router
o The Component Router
o View Navigation
o The Angular Router API
o Creating a Router Enabled Application
o Hosting the Routed Components
o Navigation Using Links and Buttons
o Programmatic Navigation
o Passing Route Parameters
o Navigating with Route Parameters
o Obtaining the Route Parameter Values
o Retrieving a Route Parameter
o Routing Enabled Feature Module
o Using the Feature Module
o Lazy Loading the Feature Module
o Creating Links for the Feature Module
o Components
o More About Lazy Loading
o Preloading Modules
o routerLinkActive binding
o Default Route
o Wildcard Route Path
o redirectTo
o Child Routes
o Defining Child Routes
o for Child Routes
o Links for Child Routes
o Navigation Guards
o Creating Guard Implementations
o Using Guards in a Route
12. Advanced HTTP Client
o Request Options
o Returning an HttpResponse Object
o Setting Request Headers
o Creating New Observables
o Creating a Simple Observable
o The Observable.create() Method
o Observable Operators
o More About m