feat(router): handle null and undefined inputs in RouterLinkActive#68120
feat(router): handle null and undefined inputs in RouterLinkActive#68120arturovt wants to merge 1 commit intoangular:mainfrom
Conversation
atscott
left a comment
There was a problem hiding this comment.
Could you please also add your use-case to the issue report? This change was rejected the first time due to very low signal of community need in the report.
| * | ||
| * These options are passed to the `isActive()` function. | ||
| * | ||
| * When `null` or `undefined`, the default subset match behavior is used. |
There was a problem hiding this comment.
This documentation doesn't reflect the PR description (or implementation)
63e937b to
f1d270e
Compare
|
@atscott I just met the same situation recently as described in the issue, I've updated commit description. |
that’s not really true is it? Why not this: That seems like quite a small thing to have to do. |
Without this change, components that use RouterLinkActive in multiple contexts (e.g. both a navigation menu and body content) are forced to branch the template for every conditional input: @if (activeClass) { <a [routerLink]="href" [routerLinkActive]="activeClass" [routerLinkActiveOptions]="activeOptions" [ariaCurrentWhenActive]="ariaCurrent"> <ng-content /> </a> } @else { <a [routerLink]="href"><ng-content /></a> } Every additional input multiplies the branching, and each @if/@else injects unwanted comment nodes into the DOM. There is no way to conditionally attach a directive in Angular templates, making imperative TypeScript instantiation the only alternative. Accepting null/undefined collapses this to a single template branch: <a [routerLink]="href" [routerLinkActive]="activeClass" [routerLinkActiveOptions]="activeOptions" [ariaCurrentWhenActive]="ariaCurrent"> <ng-content /> </a> When activeClass is undefined (e.g. in content areas), the directive stays mounted but applies no CSS classes. When it is a string (e.g. in the navigation), normal active-class behavior applies — no branching, no extra DOM nodes, no TypeScript workarounds. - `routerLinkActive`: null/undefined now sets an empty class list. - `routerLinkActiveOptions`: null and undefined are treated differently: - undefined → falls back to the default subset match ("not set") - null → explicit opt-out, link is never considered active Closes angular#66233
f1d270e to
d085ebe
Compare
|
@atscott I have also updated the code with a return-guard in 1.
|
|
Woah, looks like you've opened a lot of issues/PRs recently. While we appreciate contributions from the community, triaging and reviewing a large influx of content in a short time period takes time away from other ongoing projects. As a result, we're closing these issues/PRs to maintain the team's focus. Note that this is not necessarily a rejection of the goals or direction of any of these contributions in particular, so much as a reflection of the team's current capacity and priorities. You are welcome to open a smaller subset of issues/PRs in accordance with our policy focused on the most important and impactful contributions and we will do our best to prioritize a response as soon as possible. |
Without this change, components that use RouterLinkActive in multiple
contexts (e.g. both a navigation menu and body content) are forced to
branch the template for every conditional input:
@if (activeClass) { <a [routerLink]="href" [routerLinkActive]="activeClass" [routerLinkActiveOptions]="activeOptions" [ariaCurrentWhenActive]="ariaCurrent"> <ng-content /> </a> } @else { <a [routerLink]="href"><ng-content /></a> }Every additional input multiplies the branching, and each @if/@else
injects unwanted comment nodes into the DOM. There is no way to
conditionally attach a directive in Angular templates, making imperative
TypeScript instantiation the only alternative.
Accepting null/undefined collapses this to a single template branch:
When activeClass is undefined (e.g. in content areas), the directive
stays mounted but applies no CSS classes. When it is a string (e.g. in
the navigation), normal active-class behavior applies — no branching, no
extra DOM nodes, no TypeScript workarounds.
routerLinkActive: null/undefined now sets an empty class list.routerLinkActiveOptions: null and undefined are treated differently:Closes #66233