Angular js

The following topics will be covered in our
AngularJS 4 & 5
Online Training:
Copyright @ 2015 Learntek. All Rights Reserved. 2

What is AngularJS?
• AngularJS is a structural framework for dynamic web apps. AngularJS
provides developers options to write client-side application (using
Typescript) in a clean MVC (Model View Controller) way. Angular is used
for Grouping the HTML into reusable components.
• Angular attempts to minimize the impedance mismatch between
document centric HTML and what an application needs by creating new
HTML constructs

Why Angular?
• It is an excellent idea to decouple the client side of an app from the
server side. This allows development work to progress in parallel, and
allows for reuse of both sides.
• DOM control structures for repeating, showing and hiding DOM
fragments.
• It is very helpful indeed if the framework guides developers through the
entire journey of building an app: From designing the UI, through writing
the business logic, to testing.

Starting with Angular 4 Application
• Angular vs Angular 2 vs Angular 4
• Overview of Sample Application
• Course Overview
• Language Use for Development
• Different Editor Overview
• Environment setup for Angular4
• Installing an Angular 4
Application
• Starting an Angular 4 Application
• Hosting Angular4 application
using seed

Components in Angular4
• Introduction
• Use of Component?
• What is Component Class
• Integrating Decorator
• Implement and defining the Metadata
• Importing Third Party Library
• Creating first App Component
• Loading/Bootstrapping App Component

Directives In Angular 4
• Create Directive using Components
• Binding/ Interpolation data in component
• Implementing ngIf Directives
• Implementing ngFor Directives

Templates and Interpolation
• Design Template in Angular4
• Building the Component

Interpolation & Pipes/Custom Pipes
• Binding property and values
• Implement Input with Two-way Binding
• Implement Events with Event Binding
• Custom Pipes and Data transforming

Nested Components
• Component inside Component
• How to use Nested Component
• Use @Input to Pass data in Nested Component
• Use @Output to Pass data from Nested Component

Deep Inside Components
• Interfaces Classes in Angular4
• Adding Styles to component
• Different Lifecycle Hooks
• Adding Custom Pipes
• How to use Module Id

Dependency Injection and Service Angular4
• What is Dependency Injection
• Design a Service
• Build the Service
• Injecting the Service

Adding Retrieving Data Using HTTP
• Building API Link
• Sending data in HTTP Request
• Exception Handling
• Observables from RXJS
• Reactive Extensions
• Subscribing data using Observable

Navigation and Routing Basics
• How Routing Works
• Configuring Routes
• Tying Routes to Actions
• Placing the Views

Angular4 Routing and Navigation
• Sending Parameters to a Route
• Activating a Route with Code
• Authenticate Routes

Form Basic in Angular 4
• Creating new angular-seed Project
• Form and ngForm in Ang4
• Stop Inbuilt Form Validation of Browser
• Add bootstrap to Style Forms and Text Input
• Use Radio Buttons in Form
• Use Select and Options in Form
• Use Checkboxes in Form

Binding Data in Angular4 Forms
• Use ngModel for 2-way binding
• Data Binding in Angular4 Forms
• Use Model Object
• Binding Models
• Data Binding in Select Control
• Data Binding in Checkbox
• Data Binding in Radio Buttons

Validate Form in Angular4
• Validation Classes
• Properties of ngModel Validation
• Display Error Messages in Form
• Add Style Controls in Errors
• Select List validation
• Deep inside the Select Control
• Enable/Disable Submit Button
• Top Form Level Validation
• Attributes of HTML 5

Posting Data using HTTP in Angular4 Forms
• Create Server Using Angular
• Post a Form data in Angular
Server
• Event Handling in Form’s Submit
• Adding Validation to form in
Angular4
• Adding RsJx
• Using Observable and a
Subscriber
• Send data to the Server
• Handling Error
• Dynamic Options for a Select
Control

Third-party Form Controls
• External Date picker in Angular4
• Adding Time picker in Forms
• Styling up ng4-bootstrap
• Add Switch in Angular4
• Multiple Radio Buttons

Modules in Angular4
• Use of Module in Angular4?
• Declarations of Array in Angular4
• Import and Export Various Array
• Angular4 Providers
• Building Shared Module in Angular4

Deployment on AWS
• EC2 Machine
• Intro to GitHub
• Deploy App on AWS

Prerequisite:
• Basic working knowledge of HTML,CSS,JavaScript,Text editor-Visual
Studio code/We storm/Atom and preffered one is Visual Studio .

Angular js

Recommended

More Related Content

What's hot (18)

Similar to Angular js (20)

More from Janu Jahnavi (20)

Recently uploaded (20)

Angular js