TabMenu: Breaking change added while fixing #13910

[Michael-Ziluck]

Describe the bug

Before #13910 and #13911, the following was an acceptable usage of the template for tab menus:

<p-tabMenu [(activeItem)]="currentTab" [model]="tabItems">
  <ng-template pTemplate="item" let-item>
    {{ item.label | translate: I18N_PRODUCT }}
  </ng-template>
</p-tabMenu>

Which would result in this display:

Now with the same markup, it results in this:

The change is because previously, the was within the tag. I know you updated the docs to reflect this, but shouldn't breaking changes be constrained to major version changes? Seems wildly arbitrary and inconvenient for users to have to make the change. I'll be opening a bug issue as well.

Environment

Angular: 16.2.12 PrimeNG: 16.7.1 Browser: latest Chrome

Reproducer

No response

Angular version

16.2.12

PrimeNG version

16.7.1

Build / Runtime

Angular CLI App

Language

TypeScript

Node version (for AoT issues node --version)

N/A

Browser(s)

Chrome

Steps to reproduce the behavior

No response

Expected behavior

No response

I can reproduce.

Version 16.5.0 didn't have this bug. Version 16.6.0 does.

[philkrpp]

Also same for me.

[NexGenUA]

I have the same problem. Also, when you click on a tab, routing does not work (routerLink). What ideas? Manually process a click on a tab, taking into account all routing options? Angular: 17.0.7 PrimeNG: 17.2.0

[DarkLeopard]

Quick fix: add a wrapper to your template following the example. <a role="menuitem" pripple [routerLink]="item.routerLink" class="p-ripple p-element p-menuitem-link">

[Michael-Ziluck]

@DarkLeopard Appreciate sharing the fix for those who are searching for a solution to this problem. For the original issue though, this should have only been introduced on a major version change as the update breaks existing usages of the component.