What's new in Angular 4
#Angular
Deprecated : <template>
<template>
=> <ng-template>
The rationale of this change is to improve the inter-operability with web components that might make use of the <template>
tag.
New feature : ELSE
In v2, for if/else statement in html, we should have done :
<p *ngIf="shouldBeDisplay">I should be displayed if shouldBeDisplay is true</p>
<p *ngIf="!shouldBeDisplay">I should be displayed if shouldBeDisplay is false</p>
Now in v4, we can do :
<p *ngIf="shouldBeDisplay; else anotherVar">I should be displayed if shouldBeDisplay is true</p>
<ng-template #anotherVar>
<p>I should be displayed if shouldBeDisplay is false</p>
</ng-template>
Another example :
<ng-template #loading>Loading...</ng-template>
<div *ngIf="userObservable | async; else loading; let user">
{{ user.name }}
</div>
Deprecated : Renderer
Now we should use import { Renderer2 } from '@angular/core'
instead of import { Renderer } from '@angular/core'
new Renderer has new methods and has better performances. Why not simply replace Renderer
? To maintain old applications which use the deprecated Renderer
. It should fully replace Renderer
in v5.
New feature : email directive
Before, to check if a mail input is valid, we should have used a pattern with a regex. Now Angular has made an email
directive which use that complex pattern.
<input type="email" ngModel name="email" required email>
Deprecated : Animations import
Before, it was imported from @angular/core
. Now it's imported from @angular/animation
.
New feature : TypeScript 2
- improve speed of compiler
- better type checking
Universal
The majority of the Universal code is now in @angular/platform-server
. Take a look in Demo Repository More documentation is forthcoming.
Performances
- decrease file size
- smaller binary