carbon-design-system / carbon-components-angular

An Angular implementation of the Carbon Design System for IBM.
https://angular.carbondesignsystem.com
Apache License 2.0
533 stars 307 forks source link

Breadcrumb: Need feature for custom component and threshold #618

Closed nitishjain07 closed 5 years ago

nitishjain07 commented 5 years ago

Hi Team,

We have two ways to create breadcrumbs using carbon breadcrumb component:

  1. 1st way is, by writing breadcrumb-item in which we can pass our own ng-content. However, this method doesn't support threshold.
  2. 2nd way is, without breadcrumb-item in which we pass items property as array of content and href. This way does support threshold but don't allow us to send our custom ng-content.

In our project, we want both threshold and custom template support.

Probable Solution- As per my finding carbon team will have to fix it in the below code in component in both showforoverflow if conditions:

Existing code is: <ibm-breadcrumb-item *ngFor="let item of items" [href]="item.href"> {{item.content}}

changes needed: You first need to check instance of item.content. If it is string then you can render as it is. However, if it is templateRef, you need to render it inside ng-container templateOutlet. So, user will be able to send custom template in content property. (something similar is already implemented in tooltip component)

(I am using below version of carbon: "carbon-components": "^10.2.0", "carbon-components-angular": "^3.7.0".)

@zvonimirfras

cal-smith commented 5 years ago

In this case I think we should prefer item.template to make it explicit, but otherwise agreed! This is definitely something we should support

carbon-bot commented 5 years ago

:tada: This issue has been resolved in version 3.13.0 :tada:

The release is available on:

Your semantic-release bot :package::rocket: