Welcome to Angular 4 : A new Angular Version

Angular 4

Angular 4

Since its release, Angular 4 is the only version of Angular that everyone seems to be talking about. While, it is said to be built on the older Angular 2, it is a complete revamp. It does not follow the same guidelines and instead builds its own new ones.

The newer version is touted as being an easier, faster and better version of Angular, making it one of the fastest adapted version of Angular. Here are a some differences between Angular 2 and Angular 4.

  • Angular 4 is quite same as Angular 2
  • Component is the mixture of an HTML template, typescript code and a component class that controls a portion of the screen.
  • Angular 4 is backward compatible with Angular 2
  • The reasons for this new major release are both new features as well as changes incompatible with the previous version.
  • Angular 4 uses Semantic Versioning.

Why not Angular 3?

Angular Router Version

If you’ve noticed there hasn’t been an Angular 3, instead it jumps directly from Angular 2 to Angular 4. Well, the reason for this is due to the misalignment of the router package’s version, the team decided to go straight for Angular v4. In this way again, all the core packages are aligned which will be easier to maintain and helps avoid confusion in the future.

Glimpse of Angular 4

Here’s a glimpse into the world of Angular 4. Find out what is exactly new in Angular, including features, packaging changes, and etc.

What’s new in Angular 4?

  • Angular 4 is Smaller and Faster
  • Animation Package

New Features:

  • View Engine
  • Improved ngIf and ngFor (now you can use if/else style syntax)
  • Angular Universal
  • TypeScript 2.1 and 2.2 Compatibility
  • Source Maps for Templates

Packaging Changes:

  • Flat ES Modules (Flat ESM/FESM)
  • Experimental ES2015 Builds
  • Experimental Closure Compatibility

Updating Angular to 4.0.0

Learn how to update your Angular 2 to Angular 4, on Windows and on Linux.

On Windows:

npm install @angular/common@latest @angular/compiler@latest @angular/compiler-cli@latest @angular/core@latest @angular/forms@latest @angular/http@latest @angular/platform-browser@latest @angular/platform-browser-dynamic@latest @angular/platform-server@latest @angular/router@latest @angular/animations@latest typescript@latest –save

Then run whatever ng serve or npm start command you normally use, and everything should work.

On Linux/Mac:

npm install @angular/{common,compiler,compiler-cli,core,forms,http,platform-browser,platform-browser-dynamic,platform-server,router,animations}@latest typescript@latest — save

Then run whatever ng serve or npm start command you normally use, and everything should work.

You can upgrade your apps from Angular 2 to Angular 4. Learn how to from here.

This would be the perfect time to get started with Angular 4. With it’s booming popularity, comfort in usage and ease of learning, Angular 4 has surpassed Angular 2 in terms of popularity. This brilliant framework is perfect for building dynamic and responsive apps.