This Edureka "Angular 2 Training" tutorial will help you to learn how to create an application in Angular 2. Angular 2 is a framework to develop highly scalable, fast, and testable web client-side applications. Below are the topics covered in this tutorial:
1) Companies Using Angular
2) Angular 2 Job Trends
3) Creating Web Application in Angular 2
4) Building Blocks of Angular App
5) Components
6) Directives
7) Services
8) Router
Subscribe to our channel to get updates. Check our complete Angular playlist here: https://goo.gl/09KsDC
4. www.edureka.co/angular-jsEDUREKA ANGULAR 2 CERTIFICATION TRAINING
Companies Using Angular JS
Netflix decided to use Angular in
its tool for analyzing and
monitoring security of Amazon
Web Services.
5. www.edureka.co/angular-jsEDUREKA ANGULAR 2 CERTIFICATION TRAINING
Companies Using Angular JS
As of Sept’ 15, the website holds
the third place by number of
visitors among all online
newspapers and magazines
available online in UK
User interface of website is made
as an AngularJS app written
according to ES 2015.
6. www.edureka.co/angular-jsEDUREKA ANGULAR 2 CERTIFICATION TRAINING
Companies Using Angular JS
YouTube is available consoles
produced by Sony and PS3
app was written using
Angular JS framework
Youtube’s estimated worth is $70
billion. Service has one
billion users i.e. one third of
people using Internet worldwide.
7. www.edureka.co/angular-jsEDUREKA ANGULAR 2 CERTIFICATION TRAINING
Companies Using Angular JS
Weather.com gives you one of
the most precise weather
forecasting reports and is uses
Angular JS
8. www.edureka.co/angular-jsEDUREKA ANGULAR 2 CERTIFICATION TRAINING
Companies Using Angular JS
PayPal company owns online
payments system available in 203
countries
PayPal is another example of large
websites using AngularJS.
9. www.edureka.co/angular-jsEDUREKA ANGULAR 2 CERTIFICATION TRAINING
Companies Using Angular JS
Freelancer is one other example
of large websites that uses
AngularJS.
Freelancer is world famous
marketplace for outsourcing with
around 15.7 million registered
freelancers
15. www.edureka.co/angular-jsEDUREKA ANGULAR 2 CERTIFICATION TRAINING
Building Blocks
Components ServicesDirectives Router
A component
controls a patch of
screen called a view.
Service encompasses any value,
function, or feature required
(not related to view)
DOM gets manipulated as
per the instructions given
by directives.
Routers is for navigating
among different
components
18. www.edureka.co/angular-jsEDUREKA ANGULAR 2 CERTIFICATION TRAINING
Building Blocks
Navbar Component
About Component
Movies Component
Home Component
Home Page View of
the App
It contains the About
section
It shows the list of top 250
movies
Responsible for
navigation among
components
19. www.edureka.co/angular-jsEDUREKA ANGULAR 2 CERTIFICATION TRAINING
Component
Movie Details Component
Displays details of
the selected movie
Movies Component
(List of Movies)
21. www.edureka.co/angular-jsEDUREKA ANGULAR 2 CERTIFICATION TRAINING
Movies Component
Generates component tag, used for
loading component across other
components
Component Class
Decorator: Specifies
component meta data
Paths to HTML and CSS
Style Doc
23. www.edureka.co/angular-jsEDUREKA ANGULAR 2 CERTIFICATION TRAINING
Directives
Changes the appearance or behavior of a DOM element
Adds & removes DOM elements to
change DOM layout
Changes the appearance or behavior of an
element
Directives with a templateComponents
Structural Directives
Attributes Directive
1
2
3
25. www.edureka.co/angular-jsEDUREKA ANGULAR 2 CERTIFICATION TRAINING
Directive
*ngFor: Structural Directive
Iterates over elements of a movies list
which is then displayed
27. www.edureka.co/angular-jsEDUREKA ANGULAR 2 CERTIFICATION TRAINING
Directive
*appBoldText: Attributes Directive
Makes the text to be bold if user points a
movie in the list
29. www.edureka.co/angular-jsEDUREKA ANGULARJS CERTIFICATION TRAINING
Services
{ }
Data Access
Logging
Business Logic
Configuration
Components
SERVICES
Service is a broad category encompassing any value, function, or feature that your
application needs.
logging service data service message bus tax calculator
Example:
{ }Directives
Services
33. www.edureka.co/angular-jsEDUREKA ANGULARJS CERTIFICATION TRAINING
Dependency Injection
Creates a new instance of class
along with its required
dependencies
Used to provide services to a
components as per their needs
Service 2
{ }
Service 2
{ }
Component
Service 1
{ }
Service 3
{ }
The process of providing a
service to component is called
Dependency Injection
Dependency Injection
37. www.edureka.co/angular-jsEDUREKA ANGULAR 2 CERTIFICATION TRAINING
Router
A router allows us to navigate across components in a Web App
Navbar Component
About Component
Movies Component
Home Component
Home Page View of
the App
It contains the About
section
It shows the list of top 250
movies
Responsible for
navigation among
components