Difference Between Angular2 and AngulrJS

Introduction

In my previous article we had discussed the goals of Angular2, This blog describes the differences available between Angular2 and AngularJS.

Getting Started

Angular developers have made many changes in Angular2 which made Angular2 different from AngularJS. All the changes have done keeping in mind, for high-level performance, mobile orientation, and targeted to modern browsers like ECS6.

In this article, we are going to discuss those changes made Angular2 difference from AngularJS, below are the details points that give little idea about the difference between Angular2 and AngularJS.

1. Angular2 is 5 times faster as compare to AngularJS, If you compare the file size, angular 2 is 20kb less than angular 1 which helps in decreasing the load time for apps.
2. Angular2 user TypeScript which is supper set of JavaScript whereas AngularJS uses JavaScript.
3. Angular2 is mobile-oriented framework whereas AngularJS was not built with mobile support.
4. AngularJS uses $scope for detecting changes and maintain states whereas Angular2 uses Zone.js to detect changes faster.
5. AngularJS uses controllers whereas Angular2 uses components which provides better performance than AngularJS.
6. Angular 2 provides more choice for languages. You can use any of the languages from ES5, ES6, TypeScript or Dart to write Angular 2 code. Where, AngularJS has ES5, ES6, and Dart. Using of TypeScript is a great step as TypeScript is an awesome way to write JavaScript.
7. Angular 2 uses camelCase syntax for built-in directives. For example, ng-class is now ngClass and ng-model is now ngModel.
8. One of the major changes in Angular 2 is, that it directly uses the valid HTML DOM element properties and events. Due to this, many of the available built-in directives in AngularJS are now no longer required. Like ng-href, ng-src, ng-showand ng-hide. Angular 2 uses href, src and hidden properties to get the same output. And same goes with event-based directives like ng-click and ng-blur.
9. In AngularJS, ng-bind is used for one-way data binding, but with Angular 2 it is replaced with property, where ‘property’ is valid HTML DOM element property.
   AngularJS, one-way data binding
   
10. In AngularJS, $routeProvider.when() uses to configuring routing. Where in Angular 2, @RouteConfig{(...}) is used. ng-view present in AngularJS is replaced with

Summary

Many differences are there in Angular2 from AngularJS, A few points we have discussed here. If this article helped you please give a like, which encourage me to write more and more articles.

Thanks