Master Angular by example - https://goo.gl/97onLe
Learn what's new in Angular 4. The biggest change between V2 is performance enhancements that treeshake your application to remove unnecessary code that makes your app load faster.
Links:
https://angular-update-guide.firebase...
http://angularjs.blogspot.ie/2017/03/...
Angular version 4 was released on March 17th of 2017. The team has already made a minor release for version 4.1 and is working on release candidates for 4.2.
What does this mean to those of us that are new to Angular and just coming to grips with Angular 2? Well first, the good news is that there are no breaking changes. So this means you can easily upgrade your existing Angular 2 apps to version 4 by simply changing the versions in your package.json file and then re-installing your packages.
Why the jump from 2 to 4? The reason for this is that the Angular Router had already received a major update from 2 to 3. And to keep everything in line, the team decided to make the next major release as version 4.
The Team has decided on using Semantic Versioning. This means there will be a major release every 6 months and minor releases every 1-3 months. So now you can expect the next major release of Angular which will be version 5 toward the end of 2017. This will enable Angular to keep evolving with new features being added and obsolete ones removed. The link to Angular Semantic Versioning explained will be provided in the description.
Moving forward how do we refer to angular, should we keep on calling it Angular 2, 4 and in the future 5? The team would like us to just use the term Angular to refer to all current and future versions, since the core framework features like Components, Services and Observables will not be changing.
So now that we've discussed the fact that are no breaking changes between version 2 and 4, what changes have been made?
Most of the changes in Angular 4 are performance improvements for the framework. The most significant change being the introduction of Flat ES6 Modules that treeshake your application. This involves the compiler removing unnecessary code in order to reduce file size and help to render the application faster.
The way that we use animations has changed. Now we can just include BrowserAnimationsModule from @angular/platform-browser/animations into our NgModule instead of having to import all the various types like trigger, style and transition from angular/core.
When using ngIf in our templates, we now have the option of using an else statement. We can use the element ng-template to specify the name of our else condition after the hash symbol. And then just declare whatever we want shown in the event our showIf is false.
An email validation directive has also been included. We can now just use the keyword email inside of our input field and we will automatically have proper email validation inside our input.
A great website for checking what is required for updating to newer versions of angular is angular-update-guide.firebase.com. Here you can choose which version your upgrading to and from while also specifying your app's complexity.
The Angular team is emphasizing backwards compatibility to help us make a seamless transition from Angular 2 and expect more of the same in future versions. When changes do occur they'll probably be more in the form of API deprecations with very good error messages in our console for whenever we run into them.
So now you hopefully have a better understanding of what Angular 4 is all about and what the future of Angular looks like.