Angular 1 vs Angular 2
New Component-Based Architecture
Angular 2 is based on component based architecture. Old Controllers and $scope systems is replaced with components and directives. Now controllers and directives are most important part of AngularJS based applications. Components work with selectors. A component has a selector and associated html tag to represent it.
Differences of Representation in Angular 1 and Angular 2
At bootstrap we have to declare components before we start working with them. These components have to be imported on the page where these are used.
Input with the Event Syntax
Angular 2 makes events processing more simplified. Now applications can respond to input as an event too. You can deal with input like an event. The event syntax is simple as now you can denote events within parenthesis.
Differences of User Input handling syntax in Angular 1 and Angular 2
<input ng-model=”particular.item” type=”text”> <button ng-click=” particular.submit(item)” type=”submit”> <div class="open_grepper_editor" title="Edit & Save To Grepper">Code language: HTML, XML (xml)
<input #item type=”text”> <button (click)=”submit(item)” type=”submit”><div class="open_grepper_editor" title="Edit & Save To Grepper">Code language: HTML, XML (xml)
Angular 2 is both faster and more memory efficient than Angular 1 this is done with the help of immutable data structures. Another reason for improved performance is introduction of uni-directional data flow. There is no direct way to implement two way data flow in angular 2 . This concept is in fact implemented in an entirely different way in Angular 2. You can use export syntax to do the same.
Data flow in Angular 2
No $scope in Angular 2
Although $scope variable was an important part of angular 1 but it is deprecated in angular 2.
But the main thing to consideration is even ‘$scope’ is deprecated it is in fact is replaced by “controller”. In angular 2 properties are bound to components itself to work in applications.
Angular 2 is more transparent due to Zones
Angular 2 uses the zones mechanism. This ensures that old digest cycle is not necessary in the new environment. Angular 2 digest, if triggered by a component that is inside a zone:
With a clean @Directive annotation you can declare a directive in application. Directives can be used in components.
Improved Dependency Injection
Angular 2 has a better and improved dependency injection system. There are much more opportunities for components based applications.
There are certain benefits other benefits of AngularJS. Element references can also be available to other parts of the template. Angular team has taken a nice step to launch angular 2.