Title: Angular JS Online Training
1 2- The following topics will be covered in our
- AngularJS 4 5
- Online Training
3What 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
4Why 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.
5Starting 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
6Components 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
7Directives In Angular 4
- Create Directive using Components
- Binding/ Interpolation data in component
- Implementing ngIf Directives
- Implementing ngFor Directives
8Templates and Interpolation
- Design Template in Angular4
- Building the Component
9Interpolation Pipes/Custom Pipes
- Binding property and values
- Implement Input with Two-way Binding
- Implement Events with Event Binding
- Custom Pipes and Data transforming
10Nested Components
- Component inside Component
- How to use Nested Component
- Use _at_Input to Pass data in Nested Component
- Use _at_Output to Pass data from Nested Component
11Deep Inside Components
- Interfaces Classes in Angular4
- Adding Styles to component
- Different Lifecycle Hooks
- Adding Custom Pipes
- How to use Module Id
12Dependency Injection and Service Angular4
- What is Dependency Injection
- Design a Service
- Build the Service
- Injecting the Service
13Adding Retrieving Data Using HTTP
- Building API Link
- Sending data in HTTP Request
- Exception Handling
- Observables from RXJS
- Reactive Extensions
- Subscribing data using Observable
14Navigation and Routing Basics
- How Routing Works
- Configuring Routes
- Tying Routes to Actions
- Placing the Views
15Angular4 Routing and Navigation
- Sending Parameters to a Route
- Activating a Route with Code
- Authenticate Routes
16Form 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
17Binding 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
18Validate 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
19Posting Data using HTTP in Angular4 Forms
Create Server Using Angular Post a Form data in Angular Server Event Handling in Forms 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
20Third-party Form Controls
- External Date picker in Angular4
- Adding Time picker in Forms
- Styling up ng4-bootstrap
- Add Switch in Angular4
- Multiple Radio Buttons
21Modules in Angular4
- Use of Module in Angular4?
- Declarations of Array in Angular4
- Import and Export Various Array
- Angular4 Providers
- Building Shared Module in Angular4
22Deployment on AWS
- EC2 Machine
- Intro to GitHub
- Deploy App on AWS
23Prerequisite
- Basic working knowledge of HTML,CSS,JavaScript,Tex
t editor-Visual Studio code/We storm/Atom and
preffered one is Visual Studio .
24(No Transcript)