Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

TabMenu and Steps | All items with routerLink being highlighted #11028

Closed
marcioggs opened this issue Jan 4, 2022 · 0 comments
Closed

TabMenu and Steps | All items with routerLink being highlighted #11028

marcioggs opened this issue Jan 4, 2022 · 0 comments
Assignees
Labels
LTS-PORTABLE Type: Bug Issue contains a bug related to a specific component. Something about the component is not working
Milestone

Comments

@marcioggs
Copy link

marcioggs commented Jan 4, 2022

I'm submitting a ... (check one with "x")

[x] bug report => Search github for a similar issue or PR before submitting
[ ] feature request => Please check if request is not on the roadmap already https://github.com/primefaces/primeng/wiki/Roadmap
[ ] support request => Please do not submit support request here, instead see http://forum.primefaces.org/viewforum.php?f=35

Plunkr Case (Bug Reports)
https://stackblitz.com/edit/primeng-tabmenu-demo-d47ewl?file=src/app/app.component.ts

Current behavior
When the p-tabMenu contains a model attribute that refers to an array containing items with a routerLink, all these items are being highlighted mistakenly.

Expected behavior
Only the menu item referred by the attribute activeItem should be highlited.
This used to work correctly on PrimeNG 13.0.0.

Minimal reproduction of the problem with instructions
e.g. of the items array that leads to an error:

  ngOnInit() {
    this.items = [
      { label: 'Home', icon: 'pi pi-fw pi-home', routerLink: ['a'] }, // Highlighted
      { label: 'Calendar', icon: 'pi pi-fw pi-calendar', routerLink: ['b'] }, // Highlighted
      { label: 'Edit', icon: 'pi pi-fw pi-pencil', routerLink: ['c'] }, // Highlighted
      { label: 'Documentation', icon: 'pi pi-fw pi-file' }, // Not highlighted
      { label: 'Settings', icon: 'pi pi-fw pi-cog' }, // Not highlighted
    ];

Please tell us about your environment:
Operating syste: Windows 10
IDE: IntelliJ
HTTP server: Angular live server

  • Angular version: 13.1.1

  • PrimeNG version: 13.0.4

  • Browser:
    Microsoft Edge Version 90.0.818.41 (Official build) (64-bit)
    Google Chrome Version 72.0.3626.81 (Official Build) (64-bit)

  • Language: TypeScript 4.4.4

  • Node (for AoT issues): node --version = v14.15.4

@marcioggs marcioggs changed the title TabMenu: All items highlighted when using routerLink TabMenu: All items with routerLink being highlighted Jan 4, 2022
@yigitfindikli yigitfindikli added Status: Pending Review Issue or pull request is being reviewed by Core Team Type: Enhancement Issue contains an enhancement related to a specific component. Additional functionality has been add and removed Status: Pending Review Issue or pull request is being reviewed by Core Team labels Jan 5, 2022
@yigitfindikli yigitfindikli self-assigned this Jan 5, 2022
@yigitfindikli yigitfindikli added this to the 13.0.5 milestone Jan 5, 2022
@yigitfindikli yigitfindikli changed the title TabMenu: All items with routerLink being highlighted TabMenu and Steps All items with routerLink being highlighted Jan 5, 2022
@yigitfindikli yigitfindikli changed the title TabMenu and Steps All items with routerLink being highlighted TabMenu and Steps | All items with routerLink being highlighted Jan 5, 2022
@yigitfindikli yigitfindikli added Type: Bug Issue contains a bug related to a specific component. Something about the component is not working LTS-PORTABLE and removed Type: Enhancement Issue contains an enhancement related to a specific component. Additional functionality has been add labels Jan 5, 2022
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
LTS-PORTABLE Type: Bug Issue contains a bug related to a specific component. Something about the component is not working
Projects
None yet
Development

No branches or pull requests

2 participants