Angular 2 Over

Angularjs
 1.AngularJS used popular JavaScript framework for creating web application
but now the now Angular 2 and TypeScript are bringing true object
oriented web development to the mainstream, in a syntax that is strikingly
close to Java/.Net

 Angular 2 is an entirely new framework  This is an obvious realisation once

you’ve transitioned from say, Angular 1.4, to Angular 2 and should be treated
as such.  Of course there are various syntactical similarities that are carried
across, but there are vast differences conceptually that are in Angular 2.

 2. Angular 2 - uses the typescript instead of the javascript , typescript

compiles to clean,simple javascript. basically typescipt is superset of
javascript which offers support for the latest ECMAScript like ES6 features.
 Angular 2 Over
Angularjs
 3. Support for Faster and Modern Browsers Angular
2.0 stress more on browsers like IE10/11, Chrome, Firefox, Opera
& Safari on the desktop and Chrome on Android, Windows Phone
8+, iOS6 & Firefox mobile and AngularJS would support the latest
and greatest features without worrying about backward
compatibility. This would simplify the Angular app
development process.

 4. Changing World of Web ,The current version of AngularJS

cannot work with the new web components like custom
elements, HTML imports, shadow DOM etc. which allow
developers to create fully encapsulated custom elements.
 Angular version 2.0  overcomes these to support web
components.
 Angular 2 Over
Angularjs
 5. Strong and Flexible Routing , Routing which has been
supporting a wide variety of requirements and needs, like child
and sibling states is seen to bring in some features like nested
states and sibling views with version 2.0. Some other great and
extensive features (which could revamp the routing and make it
simple, scalable and extensible) like URL resolver, location
service, navigational model, push state child router, or hash
change etc. are some of the expectations which developers are
looking for.

 Focusing on components and architecture are key goals,

regardless of your future framework choices. This is essentially
what Angular 2 gives us, but with more speed, less code - once
Ahead-of-Time compiled - and better practices. Angular 1.5
introduced the .component() method on angular.module() that’s
Angular 2 Typescript support for the
browsers
 Typescript to be supported by all the modern browsers by 2018

 The features of the browsers to be upgraded to support the

Typescript complied to ES6

 Refernce for the Typescript Support please Visit the link

http://kangax.github.io/compat-table/es6/
 Angular 1.x Future

 The facts have been expressed by Google in numerous

keynotes/talks, that once the traffic levels of the documentation
for Angular 2 overtakes Angular 1.x, support will decline.
Whether that’s a very sharp slippery decline or gradual
 Angular 2 Over
Not anyAngularjs
more in Angular 2 Angular 2 : New Features
•$scope • Form Builder
•Data Definition Object •Change Detection
•Angular module •Templating
•Controllers •Routing
•jqLite/jQuery •Annotations
•Observables
•Shadow DOM
 Angular 2 : New Features
Early stage of Angular 1.x Transitional Angular 2
Angular 1.x best practices Architecture

Nested Scopes Used Heavily Avoided Avoided Gone

(“$scopes “)

Directives vs Use as alternatives Used together Directives as Component

Controllers components directives

Controller and Functions Functions ES6 Classes ES6 Classes

service
implementation

Module system Angular’s Module Angular’s Module ES6 Modules ES6 Modules

Transpiler No No TypeScript Typescript

required
Difference between A1.x and A2.0
Angular 1.x Angular 1.x
 Uses controllers and $scope  entirely component based,
services no longer used. components are directives with a
template
 [] : Data Binding to Properties
 Uses 43 directives () : Binding to events

 ES5  TypeScript/ES6
 Controllers  Components
 Filters
 Pipes
 Ng-app
 Bootstrap
 [ngClass]
 Ng-class
 (click)
 Ng-click
Difference between A1.x and A2.0
Angular 1.x Angular 1.x
 Ng-if  *ngIf
 Ng-model  [(ngModel)]
 Ng-repeat  *ngFor
 Ng-show  [hidden]
 Promises  Observables