这是用户在 2024-5-9 18:09 为 https://update.angular.io/?l=3&v=15.0-18.0 保存的双语快照页面,由 沉浸式翻译 提供双语支持。了解如何保存?
Angular Update Guide
github-circle-white-transparent

Select the options that match your update

Angular versions

From v.
To v.

Warning: Plans for releases after the current major release are not finalized and may change. These recommendations are based on scheduled deprecations.

Warning: Be sure to follow the guide below to migrate your application to the new version. You can't run ng update to update Angular applications more than one major version at a time.

Application complexity

Shows all the information we have about this update.

Other dependencies

Guide to update your Angular application v15.0 -> v18.0 for advanced applications

Before you update

You don't need to do anything before moving between these versions.

Update to the new version

Review these changes and perform the actions to update your application.

 

Make sure that you are using a supported version of node.js before you upgrade your application. Angular v16 supports node.js versions: v16 and v18.
Make sure that you are using a supported version of TypeScript before you upgrade your application. Angular v16 supports TypeScript version 4.9.3 or later.
In the application's project directory, run ng update @angular/core@16 @angular/cli@16 to update your application to Angular v16.
Make sure that you are using a supported version of Zone.js before you upgrade your application. Angular v16 supports Zone.js version 0.13.x or later.
The Event union no longer contains RouterEvent, which means that if you're using the Event type you may have to change the type definition from (e: Event) to (e: Event|RouterEvent)
In addition to NavigationEnd the routerEvent property now also accepts type NavigationSkipped
Pass only flat arrays to RendererType2.styles because it no longer accepts nested arrays
You may have to update tests that use BrowserPlatformLocation because MockPlatformLocation is now provided by default in tests. Read further.
Due to the removal of the Angular Compatibility Compiler (ngcc) in v16, projects on v16 and later no longer support View Engine libraries.
After bug fixes in Router.createUrlTree you may have to readjust tests which mock ActiveRoute. Read further
Change imports of ApplicationConfig to be from @angular/core.
Revise your code to use renderModule instead of renderModuleFactory because it has been deleted.
Revise your code to use XhrFactory from @angular/common instead of XhrFactory export from @angular/common/http.
If you're running multiple Angular apps on the same page and you're using BrowserModule.withServerTransition({ appId: 'serverApp' }) make sure you set the APP_ID instead since withServerTransition is now deprecated. Read further
Change EnvironmentInjector.runInContext to runInInjectionContext and pass the environment injector as the first parameter.
Update your code to use ViewContainerRef.createComponent without the factory resolver. ComponentFactoryResolver has been removed from Router APIs.
If you bootstrap multiple apps on the same page, make sure you set unique APP_IDs.
Update your code to revise renderApplication method as it no longer accepts a root component as first argument, but instead a callback that should bootstrap your app. Read further
Update your code to remove any reference to PlatformConfig.baseUrl and PlatformConfig.useAbsoluteUrl platform-server config options as it has been deprecated.
Update your code to remove any reference to @Directive/@Component moduleId property as it does not have any effect and will be removed in v17.
Update imports from import {makeStateKey, StateKey, TransferState} from '@angular/platform-browser' to import {makeStateKey, StateKey, TransferState} from '@angular/core'
If you rely on ComponentRef.setInput to set the component input even if it's the same based on Object.is equality check, make sure you copy its value.
Update your code to remove any reference to ANALYZE_FOR_ENTRY_COMPONENTS injection token as it has been deleted.
entryComponents is no longer available and any reference to it can be removed from the @NgModule and @Component public APIs.
ngTemplateOutletContext has stricter type checking which requires you to declare all the properties in the corresponding object. Read further.
Angular packages no longer include FESM2015 and the distributed ECMScript has been updated from 2020 to 2022.
The deprecated EventManager method addGlobalEventListener has been removed as it is not used by Ivy.
BrowserTransferStateModule is no longer available and any reference to it can be removed from your applications.
Update your code to use Injector.create rather than ReflectiveInjector since ReflectiveInjector is removed.
QueryList.filter now supports type guard functions. Since the type will be narrowed, you may have to update your application code that relies on the old behavior.
Make sure that you are using a supported version of node.js before you upgrade your application. Angular v17 supports node.js versions: v18.13.0 and newer
Make sure that you are using a supported version of TypeScript before you upgrade your application. Angular v17 supports TypeScript version 5.2 or later.
Make sure that you are using a supported version of Zone.js before you upgrade your application. Angular v16 supports Zone.js version 0.14.x or later.
In the application's project directory, run ng update @angular/core@17 @angular/cli@17 to update your application to Angular v17.
Angular now automatically removes styles of destroyed components, which may impact your existing apps in cases you rely on leaked styles. To change this update the value of the REMOVE_STYLES_ON_COMPONENT_DESTROY provider to false.
Make sure you configure setupTestingRouter, canceledNavigationResolution, paramsInheritanceStrategy, titleStrategy, urlUpdateStrategy, urlHandlingStrategy, and malformedUriErrorHandler in provideRouter or RouterModule.forRoot since these properties are now not part of the Router's public API
For dynamically instantiated components we now execute ngDoCheck during change detection if the component is marked as dirty. You may need to update your tests or logic within ngDoCheck for dynamically instantiated components.
Handle URL parsing errors in the UrlSerializer.parse instead of malformedUriErrorHandler because it's now part of the public API surface.
Change Zone.js deep imports like zone.js/bundles/zone-testing.js and zone.js/dist/zone to zone.js and zone.js/testing.
You may need to adjust your router configuration to prevent infinite redirects after absolute redirects. In v17 we no longer prevent additional redirects after absolute redirects.
Change references to AnimationDriver.NOOP to use NoopAnimationDriver because AnimationDriver.NOOP is now deprecated.
You may need to adjust the equality check for NgSwitch because now it defaults to stricter check with === instead of ==. Angular will log a warning message for the usages where you'd need to provide an adjustment.
Use update instead of mutate in Angular Signals. For example items.mutate(itemsArray => itemsArray.push(newItem)); will now be items.update(itemsArray => [itemsArray, …newItem]);
To disable hydration use ngSkipHydration or remove the provideClientHydration call from the provider list since withNoDomReuse is no longer part of the public API.
If you want the child routes of loadComponent routes to inherit data from their parent specify the paramsInheritanceStrategy to always, which in v17 is now set to emptyOnly.

After you update

You don't need to do anything after moving between these versions.