exclude certain routes from showing breadcrumbs

gmostert / ng2-breadcrumb

This is an angular 2 component that creates a breadcrumb trail. It hooks into the angular2/router, to dynamically build up the crumb trail once a component is routed to.

MIT License

102 stars 80 forks source link

exclude certain routes from showing breadcrumbs #12

Closed malindamiller closed 8 years ago

malindamiller commented 8 years ago

I have a project nested in another project. My route looks like this: http://localhost:8080/app/resources/dashboard/health

but I want my breadcrumbs to just show Application Health and Monitoring (alias for "/health") I set the friendly name for "/"app" and "/resources" and "/dashboard" to empty string but I am still seeing "////Application Health and Monitoring"

Any suggestion how to fix this?

gmostert commented 8 years ago

Will prob have to update the service with an exclude path function. Before I get to that, how good is your css?

The links that are shown, are li elements in an ul element. You could try and target the exact items with an css selector and just make them display:none. The main ul element uses a class called breadcrumb, so its easy to target.

malindamiller commented 8 years ago

So I tried to set a css selector but this is setting on the a tag, not the li tag so when i do the css "display:none" on each a tag, the backslash still exists `

Home

            <li *ngFor="let url of _urls; let last = last; let i = index" [ngClass]="{'active': last}"> <!-- disable link of last item -->
                <a role="button" class = "breadcrumbi--{{i}}" *ngIf="!last" (click)="navigateTo(url)">{{index}}, {{friendlyName(url)}}</a>
                <span *ngIf="last">{{friendlyName(url)}}</span>
            </li>`

malindamiller commented 8 years ago

I have fixed this issue by changing the base href of my project for which I want to use the breadcrumbs!