53

Recently someone told me about Angular 4, what is it? How is it different from Angular 2? I am learning Angular 2. I tried to find the official website of Angular 4 but I didn't get the result. I am very curious about it.

EDIT

Angular 4 website is now available here.

EDIT 2

Angular 5 (beta) is now available here.

EDIT 3

Angular 5 is now available here, the changes are available here

EDIT 4

Angular 6 is now available here.

EDIT 5

Angular 7 is now available.

EDIT 6

Angular 8 is now available here.

For updates and new features, please visit Angular blog post for version 8

Edit 7

Angular 9 documentation can be found here https://next.angular.io/docs

For updates and new features, please visit Angular blog post for version 9

Arpit Kumar
  • 2,179
  • 5
  • 28
  • 53

6 Answers6

57

Angular 4 is just a newer version of Angular than Angular 2.

Angular 2.x.x, and Angular 4.x.x are also named Angular, while the previous version (1.x.x) is named AngularJS.
This name difference indicates that there are major differences, while Angular 4.x.x is only a newer version of Angular than Angular 2.x.x is.

Angular uses semantic versioning since Angular 2, which requires the major number being increased when breaking changes were introduced.

The Angular team postponed features that cause breaking changes, which will be released with Angular 4.

Angular version 3.x.x was skipped to be able to align the version numbers of the core modules, because the Router already had version 3.

To see what changes will be introduced in Angular4 see https://github.com/angular/angular/blob/master/CHANGELOG.md

See also this blog post http://angularjs.blogspot.co.at/2016/10/versioning-and-releasing-angular.html

Günter Zöchbauer
  • 623,577
  • 216
  • 2,003
  • 1,567
  • 9
    @amdev no it wasn't. As I mentioned, it was to get all modules aligned to the same major version number. Because only 3 months before the release of 2.0.0, they dropped the old router and created a new one and used a new version number (3.0.0) for it, and this unplanned step was ironed out with the step to 4.0.0 for all packages. – Günter Zöchbauer May 05 '17 at 14:39
23

1)What’s New?

1.1 Smaller & Faster

1.2 Animation Package

Pulled animations out of @angular/core and into their own package. This means that if you don’t use animations, this extra code will not end up in your production bundles.

2) New Features

2.0) View engine

The new view engine significantly improves the compilation step which results in smaller application size compared to earlier iterations.

2.1 Improved *ngIf and *ngFor You can now use an if/else style syntax, and assign local variables such as when unrolling an observable.

  <div *ngIf="userList | async as users; else loading">
   <user-profile *ngFor="let user of users; count as count" [user]="user">
   </user-profile>
   <div>{{count}} total users</div>
 </div>
 <ng-template #loading>Loading...</ng-template>

2.2 Angular Universal

2.3 TypeScript 2.1 and 2.2 compatibility

2.4 Source Maps for Templates

Now when there is an error caused by something in one of your templates, it generate source maps that give a meaningful context in terms of the original template.

3) Packaging Changes

3.1 Flat ES Modules (Flat ESM / FESM)

This format should help tree-shaking, help reduce the size of your generated bundles, and speed up build, transpilation, and loading in the browser in certain scenarios.

3.2 Experimental ES2015 Builds

This option is experimental and opt-in. Developers have reported up to 7% bundle size savings when combining these packages with Rollup.

3.3 Experimental Closure Compatibility

making it possible to take advantage of advanced Closure optimizations, resulting in smaller bundle sizes and better tree shaking.

I got this information from this blog...... for more information refer here

Community
  • 1
  • 1
Jose Kj
  • 2,912
  • 2
  • 28
  • 40
9

What is Angular 4 ?

Angular 4 is an open source web development framework written and maintained by angular team at Google .

In order to embrace angular's capabilities better, let's look at some of the important points about angular.

  1. Angular 4 or simply Angular is the next logical version of Angular2 but it has nothing in common with Angular 1 also called AngularJS

  2. Angular is written in TypeScript and so it comes with all the capabilities that typescript offers

  3. Angular is also utilized in the cross platform mobile development framework called IONIC and so it's not limited to web apps only

To keep upgrading Angular , angular community has announced angular releases every 6 months

Here's the source for this answer and a beginner friendly tutorial on Angular 4 ::

Angular 4 Tutorial

Rishabh.IO
  • 591
  • 7
  • 6
3

These are the list of important changes in angular 4

  1. Skipping angular 3.0 to angular 4.0 so we can align core with the router which is already 3.0
  2. Compiler is faster compared to angular 2
  3. Some of the bugs which are in angular 2 are rectified in angular 4
  4. Else clause has been introduced enter image description here
  5. Render has been renamed to Renderer2 (Reason this was done is because under the hood there were lot of changes)

For more information -> http://www.prathapkudupublog.com/2017/04/important-changes-in-angular-4.html#more

Prathap Kudupu
  • 1,315
  • 11
  • 11
1

Angular 2 there is no any path breaking changes. But yes there are some extra feature had come to make angular 4 more powerful framework.

  • Reduce the size of view engine :- There are more advanced change in AOT of angular so improve the compilation time. These changes also reduce almost 60% size of app.
  • Introduce new Pipe :- Angular 4 introduce new ‘titlecase’ pipe ‘|’ so using this pipe you can change the first later capital of any words.
  • ngIf and else :- Previously ‘ngIf’ is there but in angular 4 they also introduce ‘else’ so, now you can use if else block in html DOM.
  • As keyword :- Angular 4 introduce new keyword called ‘As’ for simplification of ‘let’ as previous defined
  • Animation packages :- Separate animation package from angular core. Now animation have their own package i.e. @angular/platform-browser/animations.
  • Rename Template :- Now template become ‘ng-template’. You should use ng-template tag instead of template.
  • Search params :- In angular 4 you can give search params in http request. This become easy to use.
  • New Form Validators :- There are many form validation given by angular 2 but there is one which is more concurrently use i.e. email validator. So now use email validator which is introduce in angular
Simran
  • 2,364
  • 1
  • 12
  • 19
0

Angular 2 is modern it takes advantages of features provided in the latest javascript standards and some beyond such as classes, API modules & decorators.yet it supports legacy browsers.Angular 2 has a simplifiAPIit has fewer built-in directives to learn, simpler binding.

They are not releasing Angular 3 because as they follow semantic versioning all of the libraries in github repository of Angular are versioned the same way, i.e 2.4.9 but Due to misalignment of the angular router package’s version, the team decided to go straight for Angular v4.

Divyanshu Rawat
  • 4,421
  • 2
  • 37
  • 53