Scribd
Upload
52 views

Angular JS 1

AngularJS is a JavaScript framework that uses two-way data binding, scopes in the DOM, directives, and templates to enable developers to write less code. The heart of AngularJS is two-way data binding, which binds HTML, CSS, and the state of JavaScript variables together so that whenever a variable changes, connected HTML and CSS automatically update. AngularJS also uses scopes to break code into independent and reusable pieces, directives to group HTML and JavaScript functionality, and templates to conditionally display parts of the page based on variable state.

Uploaded by

Amareswara Rao
Copyright
© © All Rights Reserved
Available Formats
Download as PDF, TXT or read online on Scribd
52 views

Angular JS 1

AngularJS is a JavaScript framework that uses two-way data binding, scopes in the DOM, directives, and templates to enable developers to write less code. The heart of AngularJS is two-way data binding, which binds HTML, CSS, and the state of JavaScript variables together so that whenever a variable changes, connected HTML and CSS automatically update. AngularJS also uses scopes to break code into independent and reusable pieces, directives to group HTML and JavaScript functionality, and templates to conditionally display parts of the page based on variable state.

Uploaded by

Amareswara Rao
Copyright
© © All Rights Reserved
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 12

What makes AngularJS so special?

write less code, go have beer sooner.

The heart of AngularJS is a


concept called two-way data
binding , which enables you to
ANGULAR JS bind Hypertext Markup
Language (HTML) and
BY
cascading style sheets (CSS) to
AMARESWARA RAO
the state of a JavaScript
AngularJS was originally variable. Whenever the variable
changes, AngularJS updates all
developed at Google by
HTML and CSS that references
testing engineer Misko
that JavaScript variable.
Hevery, who found that
existing tools, like jQuery
ANGULAR JS
Angularjs closest rivals, KnockoutJS, ReactJS, and EmberJS.

Two-Way Data Binding


Scopes in the DOM
Directives
Templates
Testing and Workflow (Testing tools: Karma, protractor,
and ngScenario)
TWO-WAY DATA BINDING

When the value of the JavaScript variable


changes, the HTML or CSS property is updated to
match. The opposite is also true: If the user types
in an input field, the value of the bound JavaScript
variable is updated to match what the user typed.
SCOPES IN THE DOM

AngularJS allows you to create scopes in the DOM


that behave similarly to scopes in JavaScript and
other programming languages.

This permits you to break your HTML and


JavaScript into independent and reusable pieces.

The ngController directive is one way to create a


new scope, enabling you to reuse the same code
for two different purposes.
SCOPES IN THE DOM
DIRECTIVES

Directives are a powerful tool for grouping HTML


and JavaScript functionality into one easily
reusable bundle.

You can write your own custom directives as well.

ngController and ngModel ....


TEMPLATES

On top of two-way data binding, AngularJS lets


you swap out entire portions of the page based on
the state of a JavaScript variable.

The ngInclude directive enables you to


conditionally include templates
TEMPLATES
TEMPLATES
TESTING AND WORKFLOW
Providing a framework for writing unit-testable code has been a
core AngularJS goal from its first release.

AngularJS includes an elegant and sophisticated dependency


injector, and all AngularJS components (controllers, directives,
services, and filters) are constructed using the dependency
injector.

the AngularJS team has developed numerous powerful testing


tools, such as the Karma test runner and the protractor and
ngScenario integration testing frameworks.

AngularJSs architecture and testing tools interface nicely with


various open source JavaScript build and workflow tools, such as
Gulp and Grunt.
WHEN NOT TO USE ANGULARJS
Applications Requiring Support for Old Versions of Internet
Explorer

AngularJS 1.0.x supports Internet Explorer 6 and 7,


AngularJS 1.2.x, supports only Internet Explorer 8 and greater.
AngularJS 1.3.x, supports only Internet Explorer 9 and greater.
Applications That Dont Require JavaScript Server I/O

write your blog in AngularJS is usually a poor decision.

If you were to write a blog in AngularJS, you would need to do


some extra work to make sure search engines could effectively
crawl your blog, because search engine crawlers dont execute
JavaScript.
WHEN TO USE ANGULARJS
Internal Data-Intensive Applications

to display complex data in a browser UI, such as continuous integration


frameworks or product dashboards.

Mobile Websites

AngularJS has powerful animation support, and single-page apps


enable you to leverage browser caching to minimize your bandwidth
usage.

Building a Prototype

Two-way data binding enables the front-end JavaScript engineer to


expose an application programming interface (API) that a UI/UX
designer can then access in HTML, enabling both the front-end engineer
and the designer to work in their preferred environments without
stepping on each others toes.

You might also like