Angular 1x Vs. Angular 2: What’s New?

Recently Angular2 was launched, and it is a completely revived framework with major performance improvements and changes. It’s so different, that you could give it a new name, and just like Angular1, Angular2 is a huge learning curve. Angular 2 doesn’t just have better performance, it’s easier to use, is future proof with ES6 and uses emerging web standards. Here are some of the major differences you’ll find in Angular2 in comparison to Angular1:

Mobile Support

Mobile support wasn’t available with Angular1, although there are libraries that make Angular1 run on mobile. Angular2 on the other hand was developed with mobile oriented architecture in mind. Libraries like Nativescript speed up Angular2 mobile development.

TypeScript

TypeScript is heavily used in Angular2, and so is DART (used by Google). Typescript is easily learned by Java and .Net developers. For those who don’t know what TypeScript is, it’s an extension of ECMAScript:

TypeScript = ES6 + Types + Annotations

Because Angular2 uses TypeScript, the functionality of TypeScript itself and its libraries can be used. Angular is merely a framework that couples different features. Other libraries can easily be used. For example, you can use the MongoDB interface because it already has a connector in TypeScript. Also, In TypeScript, lambdas have been made available and so have generics, which can be used in the frontend.

Component Based

Angular2 is entirely component based, which is a pretty big deal because that means no more usage of controllers and $scope. Instead, those have been completely replaced by components and directives.

The below image shows how a component is built. This one is in HTML called the <angularComponent>

Directives

With Angular2, specifications for directives are completely simplified, yet subject to change. A directive can be declared with the @Directive annotation and can be used in components. Directives existed with Angular 1, but the architectural directives syntax is completely changed. For instance, ng-rpeat has been replaced with *ngFor :

///Angular 1.x structural directives:……..

<ul>

<li ng-repeat=”item in items”>

        {{item.name}}

</li>

</ul>

///Angular 2 structural directives:………….

<ul>

<li *ngFor=”#item of items”>

{{item.name}}

</li>

</ul>

What are the benefits of Angular 2? One of our leading experts in the field, Yakov Fain will show you in an interactive 1 hour webinar, Thursday March 2nd 2017 at 1pm EST.

Save your space here:

https://starweaver.com/event/angular-2-frameworks-high-level-overview/

 

Leave A Reply