AngularJs
and Angular 2
Angular JS
|
Angular 2
|
|
1
|
1st the version was released in 2010 and its called as Angular 1 or mostly Angular JS
|
Angular
2 released in 2016
|
2
|
Its
MVC based architecture, means we design angular JS as model-view-controller,
and we write code on typescript only
|
It
is component-based architecture, means Angular 2 onwards we included
component as to make angular more efficient.
|
3
|
It
doesn’t support
|
It
support ES6 and typescript
|
4
|
It
doesn’t support
|
It
support mobile devices.
|
5
|
Its
written in JavaScript
|
Angular
2 is totally rewritten in typescript
|
6
|
More
testable as component-based
|
Angular
3
Why we don’t have Angular 3?
Angular developed in a MonoRepo it means a single repo
for
everything. @angular/core, @angular/compiler, @angular/router etc
are in the same repo and may have their own versions.
Now the problem is with the @angular/router which is already in a 3.X version. And that’s
Now the problem is with the @angular/router which is already in a 3.X version. And that’s
Because of some
active and huge developments on the router section, like route-preload.
Now releasing Angular as version 3, with its route on
version 4 will create confusion
To avoid this confusion they decided to skip the
version 3 and release with version 4.0.0, so that every major dependency in the
MonoRepo are on the right track.
Angular
2 and Angular 4
v Angular
4 released in 2017.
v Changes
in Core library
v Compare
to Angular2 there is a lot of performance changes in angular4
Angular 2
|
Angular 4
|
|
1
|
It doesn’t support all features
|
all feature of typescript 2.1 & 2.2 are supported
in Angular 4 application
|
2
|
Animation features are included in Angular core only
|
Animation features are separated
from @angular/core to @angular/animation
|
3
|
Here else block was not implemented so we have to
write two *ngIf
|
Else block in *ngIf introduced
|
Angular
4 and Angular 5
v Angular
5 released in 1st November 2017.
v Angular
5 released with lot of new features and with performance and bug fixes from
angular 4
Angular 4
|
Angular 5
|
|
1
|
Build Optimizer doesn’t exist here
|
Build optimizer: It
helps to removed unnecessary code from your application
|
2
|
Compiler slower than angular 5
|
Compiler Improvements: This
improved the support of incremental compilation of an application.
|
3
|
Preserve White space doesn’t exist here
|
Preserve White space: Its
introduce in angular 5 to remove unnecessary new lines, tabs and white spaces
// in component decorator you can now add:
“preserveWhitespaces: false” // or in tsconfig.json: “angularCompilerOptions”: { “preserveWhitespaces”: false}` |
v Few
new Router Life-cycle Events being added in Angular 5: In Angular 5 few new
life cycle events being added to the router and those are:
v ActivationStart,
ActivationEnd, ChildActivationStart, ChildActivationEnd, GuardsCheckStart,
GuardsCheckEnd, ResolveStart and ResolveEnd.
Angular 4
|
Angular 5
|
|
4
|
Here
we use HttpClient: which we import from @angular/HTTP library
|
HttpClientModule
is introduced which comes under @angular/common/http package.
|
5
|
It
doesn’t support
|
Angular
5 supports TypeScript 2.3 version.
|
Angular
5 and Angular 6
v Angular
6 release in April 2018.
v No
major changes.
v Dependency
on RxJS 6.
v Registering
provider: To register new service/provider, we import Service into module and
then inject in provider array.
v CLI
Changes: Two new commands have been introduced
— ng update <package> Ã to update the package
— ng update <package> Ã to update the package
v —
ng add à to add new library like ng add @angular/material
Angular 5
|
Angular 6
|
|
1
|
Here we use <template> tag for keeping if and
else block
|
Remove support for <template> tag and
replace with“<ng-template>”
|
2
|
Here we use .angular-cli.json
|
It uses angular.json instead of .angular-cli.json
|
3
|
It support single project.
|
It supports multiple project which we can add-in
angular.json
|
Angular 7
v Angular
7 release in October 2018.
v This
is a major release and expanding to the entire platform including-
— Core framework,
— Angular Material,
— CLI
— Core framework,
— Angular Material,
— CLI
v Angular
7 added UrlSegment[] to CanLoad interface and DoBootstrap interface.
v It
added a Compatibility Compiler (ngcc) compiler.
v Introduce
a new Pipe called — KeyValuePipe
v Angular
7 now supporting to TypeScript 2.9.
v Added
a new router features — warn if navigation triggered outside Angular zone
v Added new mapping for ngfactory and ngsummary files to their module names in AOT
summary resolver.
Angular 8
Angular 8 released in march
2019.
Being smaller, faster and
easier to use and it will be making Angular developer's life easier.
Added Support for
TypeScript 3.2
Added a Navigation Type
Available during Navigation in the Router
Added
pathParamsOrQueryParamsChange mode for runGuardsAndResolvers in the Router
Allow the passing state to
routerLink Directives in the Router
Allow the passing state to
NavigationExtras in the Router
Restore the whole object
when navigating back to a page managed by Angular Router
Added support for SASS
EmoticonEmoticon