Angular Js 5

Revision as of 05:59, 28 June 2018 by Rasimsen (talk | contribs) (Created page with "==Angular 5 Release: What's New?== Angular is an all-encompassing JavaScript framework that is frequently used by developers all over the world for building web, desktop, and...")
(diff) ← Older revision | Latest revision (diff) | Newer revision → (diff)

Angular 5 Release: What's New?

Angular is an all-encompassing JavaScript framework that is frequently used by developers all over the world for building web, desktop, and mobile applications. In this article, I'll cover the new features in Angular 5 and several other changes and deprecations.

Angular is built and maintained by Google. It is a platform that combines declarative templates, dependency injection, end-to-end tooling, and integrated best practices to solve development challenges. Web platforms such as Google Adwords, Google Fiber, Adsense, and Winc use Angular to build their user interfaces.

Angular 5 was announced to the world on November 1, 2017. The previous Angular version was 4.4.0. This release focused on making Angular smaller and faster to use. Let's go through the major changes in version 5.

What's New?

Http Deprecated, HttpClient Here to Stay

Before version 4.3, the @angular/http module was used for making HTTP requests in Angular applications. The Angular team has now deprecated Http in version 5. The HttpClient API from @angular/common/http package that shipped in version 4.3 is now recommended for use in all apps. The HttpClient API features include:

  • Typed, synchronous response body access, including support for JSON body types.
  • JSON is an assumed default and no longer needs to be explicitly parsed.
  • Interceptors allow middleware logic to be inserted into the pipeline.
  • Immutable request/response objects.
  • Progress events for both request upload and response download.
  • Post-request verification and flush-based testing framework.
import { HttpClientModule } from '@angular/common/http';

Support for Multiple Export Alias in Angular 5

In Angular 5, you can now give multiple names to your components and directives while exporting. Exporting a component with multiple names can help your users migrate without breaking changes.

Example Usage:

import { Component } from '@angular/core';
@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css'],
  exportAs:'dashboard, logBoard'
})
export class AppComponent {
  title = 'app';
}

Internationalized Number, Date, and Currency Pipes

Angular 5 ships with new number, date, and currency pipes that increase standardization across browsers and eliminate the need for i18n polyfills. The pipes rely on the CLDR to provide extensive locale support and configurations for any locales you want to support. To use the old pipes, you will have to import the DeprecatedI18NPipesModule after the CommonModule.

 import { NgModule } from '@angular/core';
  import { CommonModule, DeprecatedI18NPipesModule } from '@angular/common';
  @NgModule({
    imports: [
      CommonModule,
      // import deprecated module after
      DeprecatedI18NPipesModule
    ]
  })
  export class AppModule { }