16 KiB
Deprecated APIs and Features
Angular strives to balance innovation and stability. Sometimes, APIs and features become obsolete and need to be removed or replaced so that Angular can stay current with new best practices, changing dependencies, or changes in the (web) platform itself.
To make these transitions as easy as possible, we deprecate APIs and features for a period of time before removing them. This gives you time to update your apps to the latest APIs and best practices.
This guide contains a summary of all Angular APIs and features that are currently deprecated.
Features and APIs that were deprecated in v6 or earlier are candidates for removal in version 9 or any later major version. For information about Angular's deprecation and removal practices, see Angular Release Practices.
For step-by-step instructions on how to update to the latest Angular release, use the interactive update guide at update.angular.io.
Deprecated APIs
This section contains a complete list all of the currently-deprecated APIs, with details to help you plan your migration to a replacement.
Tip: In the API reference section of this doc site, deprecated APIs are indicated by strikethrough. You can filter the API list by Status: deprecated.
@angular/common
API | Replacement | Deprecation announced | Notes |
---|---|---|---|
DeprecatedI18NPipesModule |
CommonModule |
v5 | See Pipes |
DeprecatedCurrencyPipe |
CurrencyPipe |
v5 | See Pipes |
DeprecatedDatePipe |
DatePipe |
v5 | See Pipes |
DeprecatedDecimalPipe |
DecimalPipe |
v5 | See Pipes |
DeprecatedPercentPipe |
PercentPipe |
v5 | See Pipes |
@angular/core
API | Replacement | Deprecation announced | Notes |
---|---|---|---|
CollectionChangeRecord |
IterableChangeRecord |
v4 | none |
DefaultIterableDiffer |
n/a | v4 | Not part of public API. |
defineInjectable |
ΔdefineInjectable |
v8 | Used only in generated code. No source code should depend on this API. |
inject |
Δinject |
v8 | Used only in generated code. No source code should depend on this API. |
ReflectiveInjector |
Injector.create |
v5 | See ReflectiveInjector |
ReflectiveKey |
none | v5 | none |
RenderComponentType |
RendererType2 and Renderer2 |
v4 | none |
Renderer |
Renderer2 |
v4 | none |
RootRenderer |
RendererFactory2 |
v4 | none |
ViewEncapsulation.Native |
ViewEncapsulation.ShadowDom |
v6 | Use the native encapsulation mechanism of the renderer. See view.ts. |
@angular/core/testing
API | Replacement | Deprecation announced | Notes |
---|---|---|---|
TestBed.deprecatedOverrideProvider() |
[TestBed.overrideProvider() ] (api/core/testing/TestBed#overrideprovider) |
v7 | none |
TestBedStatic.deprecatedOverrideProvider() |
TestBedStatic.overrideProvider() |
v5 | none |
@angular/forms
API | Replacement | Deprecation announced | Notes |
---|---|---|---|
NgFormSelectorWarning |
n/a | v6 | See ngForm. |
@angular/router
API | Replacement | Deprecation announced | Notes |
---|---|---|---|
preserveQueryParams |
queryParamsHandling |
v4 | none |
@angular/upgrade
API | Replacement | Deprecation announced | Notes |
---|---|---|---|
All entry points | @angular/upgrade/static |
v5 | See Upgrading from AngularJS. |
@angular/upgrade/static
API | Replacement | Deprecation announced | Notes |
---|---|---|---|
getAngularLib |
getAngularJSGlobal |
v5 | See Upgrading from AngularJS. |
setAngularLib |
setAngularJSGlobal |
v5 | See Upgrading from AngularJS. |
{@a deprecated-features}
Deprecated features
This section lists all of the currently-deprecated features, which includes template syntax, configuration options, and any other deprecations not listed in the Deprecated APIs section above. It also includes deprecated API usage scenarios or API combinations, to augment the information above.
{@a component-styles}
Component styles
The shadow-piercing descendant combinator is deprecated and support is being removed from major browsers and tools. As such, in v4 we deprecated support in Angular for all 3 of /deep/
, >>>
and ::ng-deep
. Until removal, ::ng-deep
is preferred for broader compatibility with the tools.
For more information, see /deep/, >>>, and ::ng-deep in the Component Styles guide.
{@a template-tag}
<template> tag
The <template>
tag was deprecated in v4 to avoid colliding with the DOM's element of the same name (such as when using web components). Use <ng-template>
instead. For more information, see the Ahead-of-Time Compilation guide.
{@a ngform}
ngForm element selector
Support for using ngForm
element selector was deprecated in v6.
It has been deprecated to be consistent with other core Angular selectors, which are typically written in kebab-case.
Deprecated:
<ngForm #myForm="ngForm">
Replacement:
<ng-form #myForm="ngForm">
The NgFormSelectorWarning
directive is solely used to display warnings when the deprecated ngForm
selector is used.
{@a ngmodel-reactive}
ngModel with reactive forms
Support for using the ngModel
input property and ngModelChange
event with reactive form directives was deprecated in version 6.
For more information, see the usage notes for FormControlDirective
and FormControlName
.
{@a sw-versionedfiles}
Service worker versionedFiles
In the service worker configuration file ngsw-config.json
, versionedFiles
and files
have the same behavior. As of v6, versionedFiles
is deprecated; use files
instead.
For more information, see Service Worker Configuration.
{@a reflectiveinjector}
ReflectiveInjector
In v5, Angular replaced the ReflectiveInjector
with the StaticInjector
. The injector no longer requires the Reflect polyfill, reducing application size for most developers.
Before:
ReflectiveInjector.resolveAndCreate(providers);
After:
Injector.create({providers});
{@a i18n-pipes}
Pipes using Intl API
Angular used to rely on the browser to provide number, date, and currency formatting using browser i18n APIs. This practice meant that most apps needed to use a polyfill, users were seeing inconsistent results across browsers, and common formats (such as the currency pipe) didn’t match developer expectations out of the box.
In version 4.3, Angular introduced new number, date, and currency pipes that increase standardization across browsers and eliminate the need for i18n polyfills. These pipes use the Unicode Common Locale Data Repository (CLDR) instead of the JS Intl API to provide extensive locale support.
In version 5.0.0, Angular updated its standard pipes to use the CLRD implementation.
At that time, Angular also added DeprecatedI18NPipesModule
and related APIs to provide limited-time access to the old behavior. If you need to use these Deprecated*
pipes, see Angular change log and the Date Formats mappings.
Reminder: If you use these Deprecated*
pipes, you should migrate to the current APIs listed above as soon as possible. These deprecated APIs are candidates for removal in the next major release.
{@a loadChildren}
loadChildren string syntax
When Angular first introduced lazy routes, there wasn't browser support for dynamically loading additional JavaScript. Angular created our own scheme using the syntax loadChildren: './lazy/lazy.module#LazyModule'
and built tooling to support it. Now that ECMAScript dynamic import is supported in many browsers, Angular is moving toward this new syntax.
In v8, the string syntax for the loadChildren
route specification was deprecated, in favor of new syntax that uses import()
syntax.
Before:
const routes: Routes = [{
path: 'lazy',
// The following string syntax for loadChildren is deprecated
loadChildren: './lazy/lazy.module#LazyModule'
}];
After:
const routes: Routes = [{
path: 'lazy',
// The new import() syntax
loadChildren: () => import('./lazy/lazy.module').then(m => m.LazyModule)
}];
v8 update: When you update to version 8, the ng update
command performs the transformation automatically. Prior to version 7, the import()
syntax only works in JIT mode (with view engine).
{@a activatedroute-props}
ActivatedRoute params and queryParams properties
ActivatedRoute contains two properties that are less capable than their replacements and may be deprecated in a future Angular version.
Property | Replacement |
---|---|
params |
paramMap |
queryParams |
queryParamMap |
For more information see the Router guide.
{@a removed}
Removed APIs
The following APIs have been removed starting with version 8.0.0:
Package | API | Replacement | Notes |
---|---|---|---|
@angular/http |
All exports | @angular/common/http |
See below. |
@angular/http/testing |
All exports | @angular/common/http/testing |
See below. |
@angular/platform-browser |
DOCUMENT |
DOCUMENT in @angular/common |
Updating to version 8 with ng update changes this automatically. |
{@a http}
@angular/http
The entire @angular/http
package has been removed. Use @angular/common/http
instead.
The new API is a smaller, easier, and more powerful way to make HTTP requests in Angular.
The new API simplifies the default ergonomics: There is no need to map by invoking the .json()
method.
It also supports typed return values and interceptors.
To update your apps:
- Replace
HttpModule
withHttpClientModule
(from@angular/common/http
) in each of your modules. - Replace the
Http
service with theHttpClient
service. - Remove any
map(res => res.json())
calls. They are no longer needed.
For more information about using @angular/common/http
, see the HttpClient guide.
@angular/http |
Closest replacement in @angular/common/http |
---|---|
BaseRequestOptions |
HttpRequest |
BaseResponseOptions |
HttpResponse |
BrowserXhr |
|
Connection |
HttpBackend |
ConnectionBackend |
HttpBackend |
CookieXSRFStrategy |
HttpClientXsrfModule |
Headers |
HttpHeaders |
Http |
HttpClient |
HttpModule |
HttpClientModule |
Jsonp |
HttpClient |
JSONPBackend |
JsonpClientBackend |
JSONPConnection |
JsonpClientBackend |
JsonpModule |
HttpClientJsonpModule |
QueryEncoder |
HttpUrlEncodingCodec |
ReadyState |
HttpBackend |
Request |
HttpRequest |
RequestMethod |
HttpClient |
RequestOptions |
HttpRequest |
RequestOptionsArgs |
HttpRequest |
Response |
HttpResponse |
ResponseContentType |
HttpClient |
ResponseOptions |
HttpResponse |
ResponseOptionsArgs |
HttpResponse |
ResponseType |
HttpClient |
URLSearchParams |
HttpParams |
XHRBackend |
HttpXhrBackend |
XHRConnection |
HttpXhrBackend |
XSRFStrategy |
HttpClientXsrfModule |
@angular/http/testing |
Closest replacement in @angular/common/http/testing |
---|---|
MockBackend |
HttpTestingController |
MockConnection |
HttpTestingController |