What's new in Angular5

예전에 정리해놨던 자료인데 재업합니다.

How to update to Angular 5

https://github.com/angular/angular-cli#installation

Angular 5 upgrade tool

Use a nifty tool to make upgrading as easy as possible.

Http Deprecated

4.3 버전 이하에서 HTTP requests를 위해 사용하던 @angular/http module이 @angular/common/http의 HttpClient API로 변경되었다.

• (JSON body type을 지원하는) 타입이 지정된 동기반응형 body access
• JSON은 가정 된 기본 값이며 더 이상 명시 적으로 구문 분석을 하지 않음
• Interceptors를 사용하여 파이프라인에 middleware logic을 삽입
• 변경할 수 없는 요청/반응 객체
• 요청 업로드 및 응답 다운로드 모두에 대한 진행 이벤트

Multiple Export Alias

Components와 Directives에 여러 이름을 붙일 수 있다. 여러 이름으로 component를 export하면 변경사항을 적용하지 않고 Migration할 수 있다.

Internationalized Number, Date, and Currency Pipes

새로운 숫자, 날짜, 통화 파이프가 포함되어 있어 여러 브라우저에서 표준화가 이루어지며 i18n polyfills가 필요하지 않다. 기존의 파이프를 사용하려면 import { DeprecatedI18NPipesModule } from ‘@angular/common’;을 추가해야 한다.

Improved Decorator

람다에 대한 데코레이터의 표현식 감소 및 객체 리터럴의 useValue, useFactory 및 data값을 지원한다. 람다는 명명된 함수 대신 사용될 수 있다.

Form Validation

Form은 모든 인풋 이벤트가 아닌 blur나 submit을 통해 validity와 필드의 값이 업데이트되는 시기를 결정한다. Form의 새 옵션인 updateOn은  기존의 change event 대신 blur 또는 submit events에서만 유효성을 검사하도록 한다.

Animations

새로운 transition aliases인 :increment와 :decrement가 추가되었다.

Animation queries에 음수 limits를 지원한다. 이는 elements에 처음부터보단 마지막부터 일치한다.

New Router Lifecycle Events

GuardsCheckStart, ChildActivationStart, ActivationStart, GuardsCheckEnd, ResolveStart, ResolveEnd, ActivationEnd, ChildActivationEnd 이벤트를 제공한다. 동일한 URL로 이동할 때 페이지를 다시 로드하드록 라우터를 구성할 수 있다.

@angular/service-worker

@angular/service-worker를 통해 더 나은 service workers를 사용할 수 있다. 현재 CLI v1.5에선 통합되지 않아 패키지를 수동으로 설치해야한다. CLI v1.6에서는 베타 버전으로 제공된다.

Deprecations and other updates

Deprecations	Now
NgFor	NgForOf
<template>	<ng-template>
ngGetContentSelectors()	ComponentFactory.ngContentSelectors
ReflectiveInjector	Injector.create
NgProbeToken from @angular/platform-browswer	NgProbeToken from @angular/core