Skip to content

Commit 9db114f

Browse files
arturovtAndrewKushnir
authored andcommitted
refactor(router): replace Optional with inject() flags
Replace `@Optional() link: RouterLink` constructor parameter with `link = inject(RouterLink, {optional: true})` to enable tree-shaking of the `Optional` decorator and its factory scaffolding. Bundle size reduction: `Optional` is a runtime value created by `makeParamDecorator()`. Even in production builds, ESBuild and other bundlers must keep their factory code because it is referenced via `Optional`. With `inject()`, this class is no longer referenced, allowing it and the `makeParamDecorator` scaffolding to be tree-shaken when unused elsewhere. Note: This updates the constructor signature but should not be considered a breaking change. Angular's official guidance is that directives, components, and pipes should be instantiated by the framework, not by user code. Directly calling `new RouterLinkActive(...)` is an unsupported pattern that goes against Angular's design principles. (cherry picked from commit 7724a94)
1 parent afa2ac2 commit 9db114f

File tree

2 files changed

+5
-4
lines changed

2 files changed

+5
-4
lines changed

goldens/public-api/router/index.api.md

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -838,7 +838,7 @@ export { RouterLink as RouterLinkWithHref }
838838

839839
// @public
840840
export class RouterLinkActive implements OnChanges, OnDestroy, AfterContentInit {
841-
constructor(router: Router, element: ElementRef, renderer: Renderer2, cdr: ChangeDetectorRef, link?: RouterLink | undefined);
841+
constructor(router: Router, element: ElementRef, renderer: Renderer2, cdr: ChangeDetectorRef);
842842
ariaCurrentWhenActive?: 'page' | 'step' | 'location' | 'date' | 'time' | true | false;
843843
// (undocumented)
844844
get isActive(): boolean;
@@ -856,7 +856,7 @@ export class RouterLinkActive implements OnChanges, OnDestroy, AfterContentInit
856856
// (undocumented)
857857
static ɵdir: i0.ɵɵDirectiveDeclaration<RouterLinkActive, "[routerLinkActive]", ["routerLinkActive"], { "routerLinkActiveOptions": { "alias": "routerLinkActiveOptions"; "required": false; }; "ariaCurrentWhenActive": { "alias": "ariaCurrentWhenActive"; "required": false; }; "routerLinkActive": { "alias": "routerLinkActive"; "required": false; }; }, { "isActiveChange": "isActiveChange"; }, ["links"], never, true, never>;
858858
// (undocumented)
859-
static ɵfac: i0.ɵɵFactoryDeclaration<RouterLinkActive, [null, null, null, null, { optional: true; }]>;
859+
static ɵfac: i0.ɵɵFactoryDeclaration<RouterLinkActive, never>;
860860
}
861861

862862
// @public

packages/router/src/directives/router_link_active.ts

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -13,10 +13,10 @@ import {
1313
Directive,
1414
ElementRef,
1515
EventEmitter,
16+
inject,
1617
Input,
1718
OnChanges,
1819
OnDestroy,
19-
Optional,
2020
Output,
2121
QueryList,
2222
Renderer2,
@@ -155,12 +155,13 @@ export class RouterLinkActive implements OnChanges, OnDestroy, AfterContentInit
155155
*/
156156
@Output() readonly isActiveChange: EventEmitter<boolean> = new EventEmitter();
157157

158+
private link = inject(RouterLink, {optional: true});
159+
158160
constructor(
159161
private router: Router,
160162
private element: ElementRef,
161163
private renderer: Renderer2,
162164
private readonly cdr: ChangeDetectorRef,
163-
@Optional() private link?: RouterLink,
164165
) {
165166
this.routerEventsSubscription = router.events.subscribe((s: Event) => {
166167
if (s instanceof NavigationEnd) {

0 commit comments

Comments
 (0)