Breadcrumb service max of 5 links

[lakhiii]

tried passing 6 breadcrumb links however it breaks the layout ON MOBILE if it didn't fit the screen anymore. is there a limitation for this breadcrumb link?

[cetincakiroglu]

Hi,

I couldn't replicate this issue, could you please provide a solid Stackblitz example. PrimeNG issue template https://stackblitz.com/github/primeface ... -template

Regards

[lakhiii]

You can try passing this breadcrumb label/links then run in developer tools as Iphone 12 mobile.

this.breadcrumbService.setItems([
{label: 'For Sale'},
{label: 'Country', routerLink: ['/pages/invoice']},
{label: 'State', routerLink: ['/pages/invoice']},
{label: 'City', routerLink: ['/pages/invoice']},
{label: 'Sample', routerLink: ['/pages/invoice']},
{label: '1215151452', routerLink: ['/pages/invoice']}
]);

see sample output of what happened

https://drive.google.com/file/d/1RLjMWX ... sp=sharing

[cetincakiroglu]

Hi,

You can override the default css in the related component to fix that.

For example;

Code: Select all

.route-bar-breadcrumb {
  white-space: nowrap;
  flex-wrap: wrap;
  justify-content: flex-start;
}

Regards

[lakhiii]

Thanks! it worked!

[cetincakiroglu]

You're welcome