Skip to content

fix(material/schematics): update navigation schematic with modern Angular pat...#33384

Open
Pavaneswar6699 wants to merge 1 commit into
angular:mainfrom
Pavaneswar6699:fix/navigation-schematic-modern-angular
Open

fix(material/schematics): update navigation schematic with modern Angular pat...#33384
Pavaneswar6699 wants to merge 1 commit into
angular:mainfrom
Pavaneswar6699:fix/navigation-schematic-modern-angular

Conversation

@Pavaneswar6699

Copy link
Copy Markdown

Problem

The navigation schematic generates code with several issues:

  1. Material 2 → Material 3: Uses deprecated color="primary" attribute
  2. Outdated patterns: Uses RxJS Observables instead of modern Angular Signals
  3. Mobile UX bug: Sidenav doesn't close when clicking on navigation items

Solution

  • Replaced color="primary" with mat-elevation-z4 class for Material 3
  • Converted Observable isHandset$ to Signal isHandset for modern Angular (17+)
  • Added (click)="drawer.close()" to nav links for better mobile UX
  • Simplified template logic with direct signal calls instead of async pipe

Testing

  • Generated navigation schematic and verified it works without errors
  • Mobile sidenav now closes when clicking navigation items
  • Template uses modern Angular patterns

Fixes #33381

…ular patterns

- Replace Material 2 color='primary' with Material 3 theming
- Replace Observables with Signals for modern Angular (17+)
- Fix mobile sidenav collapse by closing drawer on navigation

Fixes angular#33381
@pullapprove pullapprove Bot requested review from tjshiu and wagnermaciel June 12, 2026 08:10
@google-cla

google-cla Bot commented Jun 12, 2026

Copy link
Copy Markdown

Thanks for your pull request! It looks like this may be your first contribution to a Google open source project. Before we can look at your pull request, you'll need to sign a Contributor License Agreement (CLA).

View this failed invocation of the CLA check for more information.

For the most up to date status, view the checks section at the bottom of the pull request.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

bug(Navigation schematic): Several issues in the code generated by the navigation schematic

1 participant