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.

ng2-breadcrumb's Issues

Property 'includes' does not exist on type 'string[]'

breadcrumbService.ts:90:29
breadcrumbService.ts:99:34
breadcrumbService.ts:108:35

"@angular/common": "^2.0.2",
"@angular/compiler": "^2.0.2",
"@angular/core": "^2.0.2",
"@angular/forms": "^2.0.2",
"@angular/http": "^2.0.2",
"@angular/material": "^2.0.0-alpha.9-3",
"@angular/platform-browser": "^2.0.2",
"@angular/platform-browser-dynamic": "^2.0.2",
"@angular/router": "3.0.1",

Getting this error in breadcrumbservice.ts when installed ng-breadcrumb, help would be appreciated.

TypeError: Cannot read property 'lastIndexOf' of undefined

Since switching to Angular 4, this pops up sometimes. I haven't figured a clear pattern as to when.

It looks like BreadcrumbComponent.ngOnInit()'s subscription to router events is receiving something other than a NavigationEnd instance. Indeed you are subscribing to something defined as Observable<Event> "An observable of router events", so assuming that it will be a NavigationEnd would seem incorrect.

ERROR Error: Uncaught (in promise): TypeError: Cannot read property 'lastIndexOf' of undefined TypeError: Cannot read property 'lastIndexOf' of undefined at BreadcrumbComponent.generateBreadcrumbTrail (http://dev:3000/vendor.bundle.js:18890:16) at SafeSubscriber._next (http://dev:3000/vendor.bundle.js:18875:19) at SafeSubscriber.__tryOrUnsub (http://dev:3000/vendor.dll.js:459:16) at SafeSubscriber.next (http://dev:3000/vendor.dll.js:408:22) at Subscriber._next (http://dev:3000/vendor.dll.js:348:26) at Subscriber.next (http://dev:3000/vendor.dll.js:312:18) at Subject.next (http://dev:3000/vendor.dll.js:673:25) at Router.triggerEvent (http://dev:3000/vendor.dll.js:41572:70) at RouterConfigLoader.onLoadStart [as onLoadStartListener] (http://dev:3000/vendor.dll.js:41492:55) at RouterConfigLoader.load (http://dev:3000/vendor.dll.js:38375:18) at MergeMapSubscriber.project (http://dev:3000/vendor.dll.js:39460:107) at MergeMapSubscriber._tryNext (http://dev:3000/vendor.dll.js:26016:27) at MergeMapSubscriber._next (http://dev:3000/vendor.dll.js:26006:18) at MergeMapSubscriber.Subscriber.next (http://dev:3000/vendor.dll.js:312:18) at EverySubscriber.notifyComplete (http://dev:3000/vendor.dll.js:27852:26) at EverySubscriber._complete (http://dev:3000/vendor.dll.js:27869:14) at EverySubscriber.Subscriber.complete (http://dev:3000/vendor.dll.js:337:18) at MergeAllSubscriber._complete (http://dev:3000/vendor.dll.js:20457:30) at MergeAllSubscriber.Subscriber.complete (http://dev:3000/vendor.dll.js:337:18) at MapSubscriber.Subscriber._complete (http://dev:3000/vendor.dll.js:355:26) at MapSubscriber.Subscriber.complete (http://dev:3000/vendor.dll.js:337:18) at ArrayObservable._subscribe (http://dev:3000/vendor.dll.js:1237:24) at ArrayObservable.Observable._trySubscribe (http://dev:3000/vendor.dll.js:131:25) at ArrayObservable.Observable.subscribe (http://dev:3000/vendor.dll.js:119:27) at MapOperator.call (http://dev:3000/vendor.dll.js:20324:23) at Observable.subscribe (http://dev:3000/vendor.dll.js:116:22) at MergeAllOperator.call (http://dev:3000/vendor.dll.js:20426:23) at Observable.subscribe (http://dev:3000/vendor.dll.js:116:22) at EveryOperator.call (http://dev:3000/vendor.dll.js:27832:23) at Observable.subscribe (http://dev:3000/vendor.dll.js:116:22) at MergeMapOperator.call (http://dev:3000/vendor.dll.js:25981:23) at Observable.subscribe (http://dev:3000/vendor.dll.js:116:22) at MergeMapOperator.call (http://dev:3000/vendor.dll.js:25981:23) at Observable.subscribe (http://dev:3000/vendor.dll.js:116:22) at CatchOperator.call (http://dev:3000/vendor.dll.js:27504:23) at Observable.subscribe (http://dev:3000/vendor.dll.js:116:22) at Object.subscribeToResult (http://dev:3000/vendor.dll.js:549:27) at MergeAllSubscriber._next (http://dev:3000/vendor.dll.js:20448:42) at MergeAllSubscriber.Subscriber.next (http://dev:3000/vendor.dll.js:312:18) at MapSubscriber._next (http://dev:3000/vendor.dll.js:20353:26) at MapSubscriber.Subscriber.next (http://dev:3000/vendor.dll.js:312:18) at ArrayObservable._subscribe (http://dev:3000/vendor.dll.js:1235:28) at ArrayObservable.Observable._trySubscribe (http://dev:3000/vendor.dll.js:131:25) at ArrayObservable.Observable.subscribe (http://dev:3000/vendor.dll.js:119:27) at MapOperator.call (http://dev:3000/vendor.dll.js:20324:23) at Observable.subscribe (http://dev:3000/vendor.dll.js:116:22) at MergeAllOperator.call (http://dev:3000/vendor.dll.js:20426:23) at Observable.subscribe (http://dev:3000/vendor.dll.js:116:22) at FirstOperator.call (http://dev:3000/vendor.dll.js:28056:23) at Observable.subscribe (http://dev:3000/vendor.dll.js:116:22) at CatchOperator.call (http://dev:3000/vendor.dll.js:27504:23) at Observable.subscribe (http://dev:3000/vendor.dll.js:116:22) at MapOperator.call (http://dev:3000/vendor.dll.js:20324:23) at Observable.subscribe (http://dev:3000/vendor.dll.js:116:22) at Object.subscribeToResult (http://dev:3000/vendor.dll.js:549:27) at MergeAllSubscriber._next (http://dev:3000/vendor.dll.js:20448:42) at MergeAllSubscriber.Subscriber.next (http://dev:3000/vendor.dll.js:312:18) at ScalarObservable._subscribe (http://dev:3000/vendor.dll.js:25434:24) at ScalarObservable.Observable._trySubscribe (http://dev:3000/vendor.dll.js:131:25) at ScalarObservable.Observable.subscribe (http://dev:3000/vendor.dll.js:119:27) at MergeAllOperator.call (http://dev:3000/vendor.dll.js:20426:23) at Observable.subscribe (http://dev:3000/vendor.dll.js:116:22) at LastOperator.call (http://dev:3000/vendor.dll.js:28183:23) at Observable.subscribe (http://dev:3000/vendor.dll.js:116:22) at MapOperator.call (http://dev:3000/vendor.dll.js:20324:23) at Observable.subscribe (http://dev:3000/vendor.dll.js:116:22) at MapOperator.call (http://dev:3000/vendor.dll.js:20324:23) at Observable.subscribe (http://dev:3000/vendor.dll.js:116:22) at MapOperator.call (http://dev:3000/vendor.dll.js:20324:23) at Observable.subscribe (http://dev:3000/vendor.dll.js:116:22) at CatchOperator.call (http://dev:3000/vendor.dll.js:27504:23) at Observable.subscribe (http://dev:3000/vendor.dll.js:116:22) at MergeMapOperator.call (http://dev:3000/vendor.dll.js:25981:23) at Observable.subscribe (http://dev:3000/vendor.dll.js:116:22) at MergeMapOperator.call (http://dev:3000/vendor.dll.js:25981:23) at Observable.subscribe (http://dev:3000/vendor.dll.js:116:22) at MapOperator.call (http://dev:3000/vendor.dll.js:20324:23) at Observable.subscribe (http://dev:3000/vendor.dll.js:116:22) at MergeMapOperator.call (http://dev:3000/vendor.dll.js:25981:23) at Observable.subscribe (http://dev:3000/vendor.dll.js:116:22) at MergeMapOperator.call (http://dev:3000/vendor.dll.js:25981:23) at Observable.subscribe (http://dev:3000/vendor.dll.js:116:22) at MergeMapOperator.call (http://dev:3000/vendor.dll.js:25981:23) at Observable.subscribe (http://dev:3000/vendor.dll.js:116:22) at MapOperator.call (http://dev:3000/vendor.dll.js:20324:23) at Observable.subscribe (http://dev:3000/vendor.dll.js:116:22) at http://dev:3000/vendor.dll.js:163:34 at new ZoneAwarePromise (http://dev:3000/polyfills.dll.js:4531:29) at Observable.forEach (http://dev:3000/vendor.dll.js:159:16) at http://dev:3000/vendor.dll.js:41943:18 at new ZoneAwarePromise (http://dev:3000/polyfills.dll.js:4531:29) at Router.runNavigate (http://dev:3000/vendor.dll.js:41874:16) at http://dev:3000/vendor.dll.js:41843:51 at ZoneDelegate.invoke (http://dev:3000/polyfills.dll.js:4120:26) at Object.onInvoke (http://dev:3000/vendor.dll.js:5601:37) at ZoneDelegate.invoke (http://dev:3000/polyfills.dll.js:4119:32) at Zone.run (http://dev:3000/polyfills.dll.js:3880:43) at http://dev:3000/polyfills.dll.js:4515:57 at ZoneDelegate.invokeTask (http://dev:3000/polyfills.dll.js:4153:31) at Object.onInvokeTask (http://dev:3000/vendor.dll.js:5592:37) at ZoneDelegate.invokeTask (http://dev:3000/polyfills.dll.js:4152:36) at Zone.runTask (http://dev:3000/polyfills.dll.js:3920:47) at drainMicroTaskQueue (http://dev:3000/polyfills.dll.js:4348:35) at HTMLAnchorElement.ZoneTask.invoke (http://dev:3000/polyfills.dll.js:4219:25) at BreadcrumbComponent.generateBreadcrumbTrail (http://dev:3000/vendor.bundle.js:18890:16) at SafeSubscriber._next (http://dev:3000/vendor.bundle.js:18875:19) at SafeSubscriber.__tryOrUnsub (http://dev:3000/vendor.dll.js:459:16) at SafeSubscriber.next (http://dev:3000/vendor.dll.js:408:22) at Subscriber._next (http://dev:3000/vendor.dll.js:348:26) at Subscriber.next (http://dev:3000/vendor.dll.js:312:18) at Subject.next (http://dev:3000/vendor.dll.js:673:25) at Router.triggerEvent (http://dev:3000/vendor.dll.js:41572:70) at RouterConfigLoader.onLoadStart [as onLoadStartListener] (http://dev:3000/vendor.dll.js:41492:55) at RouterConfigLoader.load (http://dev:3000/vendor.dll.js:38375:18) at MergeMapSubscriber.project (http://dev:3000/vendor.dll.js:39460:107) at MergeMapSubscriber._tryNext (http://dev:3000/vendor.dll.js:26016:27) at MergeMapSubscriber._next (http://dev:3000/vendor.dll.js:26006:18) at MergeMapSubscriber.Subscriber.next (http://dev:3000/vendor.dll.js:312:18) at EverySubscriber.notifyComplete (http://dev:3000/vendor.dll.js:27852:26) at EverySubscriber._complete (http://dev:3000/vendor.dll.js:27869:14) at EverySubscriber.Subscriber.complete (http://dev:3000/vendor.dll.js:337:18) at MergeAllSubscriber._complete (http://dev:3000/vendor.dll.js:20457:30) at MergeAllSubscriber.Subscriber.complete (http://dev:3000/vendor.dll.js:337:18) at MapSubscriber.Subscriber._complete (http://dev:3000/vendor.dll.js:355:26) at MapSubscriber.Subscriber.complete (http://dev:3000/vendor.dll.js:337:18) at ArrayObservable._subscribe (http://dev:3000/vendor.dll.js:1237:24) at ArrayObservable.Observable._trySubscribe (http://dev:3000/vendor.dll.js:131:25) at ArrayObservable.Observable.subscribe (http://dev:3000/vendor.dll.js:119:27) at MapOperator.call (http://dev:3000/vendor.dll.js:20324:23) at Observable.subscribe (http://dev:3000/vendor.dll.js:116:22) at MergeAllOperator.call (http://dev:3000/vendor.dll.js:20426:23) at Observable.subscribe (http://dev:3000/vendor.dll.js:116:22) at EveryOperator.call (http://dev:3000/vendor.dll.js:27832:23) at Observable.subscribe (http://dev:3000/vendor.dll.js:116:22) at MergeMapOperator.call (http://dev:3000/vendor.dll.js:25981:23) at Observable.subscribe (http://dev:3000/vendor.dll.js:116:22) at MergeMapOperator.call (http://dev:3000/vendor.dll.js:25981:23) at Observable.subscribe (http://dev:3000/vendor.dll.js:116:22) at CatchOperator.call (http://dev:3000/vendor.dll.js:27504:23) at Observable.subscribe (http://dev:3000/vendor.dll.js:116:22) at Object.subscribeToResult (http://dev:3000/vendor.dll.js:549:27) at MergeAllSubscriber._next (http://dev:3000/vendor.dll.js:20448:42) at MergeAllSubscriber.Subscriber.next (http://dev:3000/vendor.dll.js:312:18) at MapSubscriber._next (http://dev:3000/vendor.dll.js:20353:26) at MapSubscriber.Subscriber.next (http://dev:3000/vendor.dll.js:312:18) at ArrayObservable._subscribe (http://dev:3000/vendor.dll.js:1235:28) at ArrayObservable.Observable._trySubscribe (http://dev:3000/vendor.dll.js:131:25) at ArrayObservable.Observable.subscribe (http://dev:3000/vendor.dll.js:119:27) at MapOperator.call (http://dev:3000/vendor.dll.js:20324:23) at Observable.subscribe (http://dev:3000/vendor.dll.js:116:22) at MergeAllOperator.call (http://dev:3000/vendor.dll.js:20426:23) at Observable.subscribe (http://dev:3000/vendor.dll.js:116:22) at FirstOperator.call (http://dev:3000/vendor.dll.js:28056:23) at Observable.subscribe (http://dev:3000/vendor.dll.js:116:22) at CatchOperator.call (http://dev:3000/vendor.dll.js:27504:23) at Observable.subscribe (http://dev:3000/vendor.dll.js:116:22) at MapOperator.call (http://dev:3000/vendor.dll.js:20324:23) at Observable.subscribe (http://dev:3000/vendor.dll.js:116:22) at Object.subscribeToResult (http://dev:3000/vendor.dll.js:549:27) at MergeAllSubscriber._next (http://dev:3000/vendor.dll.js:20448:42) at MergeAllSubscriber.Subscriber.next (http://dev:3000/vendor.dll.js:312:18) at ScalarObservable._subscribe (http://dev:3000/vendor.dll.js:25434:24) at ScalarObservable.Observable._trySubscribe (http://dev:3000/vendor.dll.js:131:25) at ScalarObservable.Observable.subscribe (http://dev:3000/vendor.dll.js:119:27) at MergeAllOperator.call (http://dev:3000/vendor.dll.js:20426:23) at Observable.subscribe (http://dev:3000/vendor.dll.js:116:22) at LastOperator.call (http://dev:3000/vendor.dll.js:28183:23) at Observable.subscribe (http://dev:3000/vendor.dll.js:116:22) at MapOperator.call (http://dev:3000/vendor.dll.js:20324:23) at Observable.subscribe (http://dev:3000/vendor.dll.js:116:22) at MapOperator.call (http://dev:3000/vendor.dll.js:20324:23) at Observable.subscribe (http://dev:3000/vendor.dll.js:116:22) at MapOperator.call (http://dev:3000/vendor.dll.js:20324:23) at Observable.subscribe (http://dev:3000/vendor.dll.js:116:22) at CatchOperator.call (http://dev:3000/vendor.dll.js:27504:23) at Observable.subscribe (http://dev:3000/vendor.dll.js:116:22) at MergeMapOperator.call (http://dev:3000/vendor.dll.js:25981:23) at Observable.subscribe (http://dev:3000/vendor.dll.js:116:22) at MergeMapOperator.call (http://dev:3000/vendor.dll.js:25981:23) at Observable.subscribe (http://dev:3000/vendor.dll.js:116:22) at MapOperator.call (http://dev:3000/vendor.dll.js:20324:23) at Observable.subscribe (http://dev:3000/vendor.dll.js:116:22) at MergeMapOperator.call (http://dev:3000/vendor.dll.js:25981:23) at Observable.subscribe (http://dev:3000/vendor.dll.js:116:22) at MergeMapOperator.call (http://dev:3000/vendor.dll.js:25981:23) at Observable.subscribe (http://dev:3000/vendor.dll.js:116:22) at MergeMapOperator.call (http://dev:3000/vendor.dll.js:25981:23) at Observable.subscribe (http://dev:3000/vendor.dll.js:116:22) at MapOperator.call (http://dev:3000/vendor.dll.js:20324:23) at Observable.subscribe (http://dev:3000/vendor.dll.js:116:22) at http://dev:3000/vendor.dll.js:163:34 at new ZoneAwarePromise (http://dev:3000/polyfills.dll.js:4531:29) at Observable.forEach (http://dev:3000/vendor.dll.js:159:16) at http://dev:3000/vendor.dll.js:41943:18 at new ZoneAwarePromise (http://dev:3000/polyfills.dll.js:4531:29) at Router.runNavigate (http://dev:3000/vendor.dll.js:41874:16) at http://dev:3000/vendor.dll.js:41843:51 at ZoneDelegate.invoke (http://dev:3000/polyfills.dll.js:4120:26) at Object.onInvoke (http://dev:3000/vendor.dll.js:5601:37) at ZoneDelegate.invoke (http://dev:3000/polyfills.dll.js:4119:32) at Zone.run (http://dev:3000/polyfills.dll.js:3880:43) at http://dev:3000/polyfills.dll.js:4515:57 at ZoneDelegate.invokeTask (http://dev:3000/polyfills.dll.js:4153:31) at Object.onInvokeTask (http://dev:3000/vendor.dll.js:5592:37) at ZoneDelegate.invokeTask (http://dev:3000/polyfills.dll.js:4152:36) at Zone.runTask (http://dev:3000/polyfills.dll.js:3920:47) at drainMicroTaskQueue (http://dev:3000/polyfills.dll.js:4348:35) at HTMLAnchorElement.ZoneTask.invoke (http://dev:3000/polyfills.dll.js:4219:25) at resolvePromise (http://dev:3000/polyfills.dll.js:4467:31) [angular] at resolvePromise (http://dev:3000/polyfills.dll.js:4438:17) [angular] at http://dev:3000/polyfills.dll.js:4515:17 [angular] at Object.onInvokeTask (http://dev:3000/vendor.dll.js:5592:37) [angular] at ZoneDelegate.invokeTask (http://dev:3000/polyfills.dll.js:4152:36) [angular] at Zone.runTask (http://dev:3000/polyfills.dll.js:3920:47) [<root> => angular] at drainMicroTaskQueue (http://dev:3000/polyfills.dll.js:4348:35) [<root>] at HTMLAnchorElement.ZoneTask.invoke (http://dev:3000/polyfills.dll.js:4219:25) [<root>] at ____________________Elapsed_45_ms__At__Wed_Apr_05_2017_17_56_31_GMT_0700__PDT_ (http://localhost) at getStacktraceWithUncaughtError (http://dev:3000/polyfills.dll.js:3628:12) [angular] at new LongStackTrace (http://dev:3000/polyfills.dll.js:3622:22) [angular] at Object.onScheduleTask (http://dev:3000/polyfills.dll.js:3693:18) [angular] at ZoneDelegate.scheduleTask (http://dev:3000/polyfills.dll.js:4133:51) [angular] at Object.onScheduleTask (http://dev:3000/polyfills.dll.js:4029:29) [angular] at ZoneDelegate.scheduleTask (http://dev:3000/polyfills.dll.js:4133:51) [angular] at Zone.scheduleTask (http://dev:3000/polyfills.dll.js:3964:43) [angular] at Zone.scheduleMicroTask (http://dev:3000/polyfills.dll.js:3984:25) [angular] at scheduleResolveOrReject (http://dev:3000/polyfills.dll.js:4513:14) [angular] at resolvePromise (http://dev:3000/polyfills.dll.js:4462:21) [angular] at http://dev:3000/polyfills.dll.js:4393:17 [angular] at Object.onInvoke (http://dev:3000/vendor.dll.js:5601:37) [angular] at Zone.run (http://dev:3000/polyfills.dll.js:3880:43) [angular => angular] at http://dev:3000/polyfills.dll.js:4515:57 [angular] at Object.onInvokeTask (http://dev:3000/vendor.dll.js:5592:37) [angular] at ZoneDelegate.invokeTask (http://dev:3000/polyfills.dll.js:4152:36) [angular] at Zone.runTask (http://dev:3000/polyfills.dll.js:3920:47) [<root> => angular] at drainMicroTaskQueue (http://dev:3000/polyfills.dll.js:4348:35) [<root>] at HTMLAnchorElement.ZoneTask.invoke (http://dev:3000/polyfills.dll.js:4219:25) [<root>] at ____________________Elapsed_0_ms__At__Wed_Apr_05_2017_17_56_31_GMT_0700__PDT_ (http://localhost) at getStacktraceWithUncaughtError (http://dev:3000/polyfills.dll.js:3628:12) [angular] at new LongStackTrace (http://dev:3000/polyfills.dll.js:3622:22) [angular] at Object.onScheduleTask (http://dev:3000/polyfills.dll.js:3693:18) [angular] at ZoneDelegate.scheduleTask (http://dev:3000/polyfills.dll.js:4133:51) [angular] at Object.onScheduleTask (http://dev:3000/polyfills.dll.js:4029:29) [angular] at ZoneDelegate.scheduleTask (http://dev:3000/polyfills.dll.js:4133:51) [angular] at Zone.scheduleTask (http://dev:3000/polyfills.dll.js:3964:43) [angular] at Zone.scheduleMicroTask (http://dev:3000/polyfills.dll.js:3984:25) [angular] at scheduleResolveOrReject (http://dev:3000/polyfills.dll.js:4513:14) [angular] at resolvePromise (http://dev:3000/polyfills.dll.js:4462:21) [angular] at http://dev:3000/polyfills.dll.js:4393:17 [angular] at http://dev:3000/polyfills.dll.js:4409:33 [angular] at Object.onInvoke (http://dev:3000/vendor.dll.js:5601:37) [angular] at Zone.run (http://dev:3000/polyfills.dll.js:3880:43) [angular => angular] at http://dev:3000/polyfills.dll.js:4515:57 [angular] at Object.onInvokeTask (http://dev:3000/vendor.dll.js:5592:37) [angular] at ZoneDelegate.invokeTask (http://dev:3000/polyfills.dll.js:4152:36) [angular] at Zone.runTask (http://dev:3000/polyfills.dll.js:3920:47) [<root> => angular] at drainMicroTaskQueue (http://dev:3000/polyfills.dll.js:4348:35) [<root>] at HTMLAnchorElement.ZoneTask.invoke (http://dev:3000/polyfills.dll.js:4219:25) [<root>] at ____________________Elapsed_1_ms__At__Wed_Apr_05_2017_17_56_31_GMT_0700__PDT_ (http://localhost) at getStacktraceWithUncaughtError (http://dev:3000/polyfills.dll.js:3628:12) [angular] at new LongStackTrace (http://dev:3000/polyfills.dll.js:3622:22) [angular] at Object.onScheduleTask (http://dev:3000/polyfills.dll.js:3693:18) [angular] at ZoneDelegate.scheduleTask (http://dev:3000/polyfills.dll.js:4133:51) [angular] at Object.onScheduleTask (http://dev:3000/polyfills.dll.js:4029:29) [angular] at ZoneDelegate.scheduleTask (http://dev:3000/polyfills.dll.js:4133:51) [angular] at Zone.scheduleTask (http://dev:3000/polyfills.dll.js:3964:43) [angular] at Zone.scheduleMicroTask (http://dev:3000/polyfills.dll.js:3984:25) [angular] at scheduleResolveOrReject (http://dev:3000/polyfills.dll.js:4513:14) [angular] at resolvePromise (http://dev:3000/polyfills.dll.js:4462:21) [angular] at http://dev:3000/polyfills.dll.js:4393:17 [angular] at http://dev:3000/vendor.dll.js:41989:25 [angular] at Object.onInvoke (http://dev:3000/vendor.dll.js:5601:37) [angular] at Zone.run (http://dev:3000/polyfills.dll.js:3880:43) [angular => angular] at http://dev:3000/polyfills.dll.js:4515:57 [angular] at Object.onInvokeTask (http://dev:3000/vendor.dll.js:5592:37) [angular] at ZoneDelegate.invokeTask (http://dev:3000/polyfills.dll.js:4152:36) [angular] at Zone.runTask (http://dev:3000/polyfills.dll.js:3920:47) [<root> => angular] at drainMicroTaskQueue (http://dev:3000/polyfills.dll.js:4348:35) [<root>] at HTMLAnchorElement.ZoneTask.invoke (http://dev:3000/polyfills.dll.js:4219:25) [<root>] at ____________________Elapsed_0_ms__At__Wed_Apr_05_2017_17_56_31_GMT_0700__PDT_ (http://localhost) at getStacktraceWithUncaughtError (http://dev:3000/polyfills.dll.js:3628:12) [angular] at new LongStackTrace (http://dev:3000/polyfills.dll.js:3622:22) [angular] at Object.onScheduleTask (http://dev:3000/polyfills.dll.js:3693:18) [angular] at ZoneDelegate.scheduleTask (http://dev:3000/polyfills.dll.js:4133:51) [angular] at Object.onScheduleTask (http://dev:3000/polyfills.dll.js:4029:29) [angular] at ZoneDelegate.scheduleTask (http://dev:3000/polyfills.dll.js:4133:51) [angular] at Zone.scheduleTask (http://dev:3000/polyfills.dll.js:3964:43) [angular] at Zone.scheduleMicroTask (http://dev:3000/polyfills.dll.js:3984:25) [angular] at scheduleResolveOrReject (http://dev:3000/polyfills.dll.js:4513:14) [angular] at ZoneAwarePromise.then (http://dev:3000/polyfills.dll.js:4602:17) [angular] at http://dev:3000/vendor.dll.js:41965:18 [angular] at new ZoneAwarePromise (http://dev:3000/polyfills.dll.js:4531:29) [angular] at Router.runNavigate (http://dev:3000/vendor.dll.js:41874:16) [angular] at http://dev:3000/vendor.dll.js:41843:51 [angular] at Object.onInvoke (http://dev:3000/vendor.dll.js:5601:37) [angular] at Zone.run (http://dev:3000/polyfills.dll.js:3880:43) [angular => angular] at http://dev:3000/polyfills.dll.js:4515:57 [angular] at Object.onInvokeTask (http://dev:3000/vendor.dll.js:5592:37) [angular] at ZoneDelegate.invokeTask (http://dev:3000/polyfills.dll.js:4152:36) [angular] at Zone.runTask (http://dev:3000/polyfills.dll.js:3920:47) [<root> => angular] at drainMicroTaskQueue (http://dev:3000/polyfills.dll.js:4348:35) [<root>] at HTMLAnchorElement.ZoneTask.invoke (http://dev:3000/polyfills.dll.js:4219:25) [<root>] at ____________________Elapsed_1332064_ms__At__Wed_Apr_05_2017_17_34_19_GMT_0700__PDT_ (http://localhost) at getStacktraceWithUncaughtError (http://dev:3000/polyfills.dll.js:3628:12) [angular] at new LongStackTrace (http://dev:3000/polyfills.dll.js:3622:22) [angular] at Object.onScheduleTask (http://dev:3000/polyfills.dll.js:3693:18) [angular] at ZoneDelegate.scheduleTask (http://dev:3000/polyfills.dll.js:4133:51) [angular] at Object.onScheduleTask (http://dev:3000/polyfills.dll.js:4029:29) [angular] at ZoneDelegate.scheduleTask (http://dev:3000/polyfills.dll.js:4133:51) [angular] at Zone.scheduleTask (http://dev:3000/polyfills.dll.js:3964:43) [angular] at Zone.scheduleMicroTask (http://dev:3000/polyfills.dll.js:3984:25) [angular] at scheduleResolveOrReject (http://dev:3000/polyfills.dll.js:4513:14) [angular] at ZoneAwarePromise.then (http://dev:3000/polyfills.dll.js:4602:17) [angular] at Router.executeScheduledNavigation (http://dev:3000/vendor.dll.js:41843:18) [angular] at MergeMapSubscriber.project (http://dev:3000/vendor.dll.js:41786:23) [angular] at MergeMapSubscriber._tryNext (http://dev:3000/vendor.dll.js:26016:27) [angular] at MergeMapSubscriber._next (http://dev:3000/vendor.dll.js:26006:18) [angular] at MergeMapSubscriber.Subscriber.next (http://dev:3000/vendor.dll.js:312:18) [angular] at BehaviorSubject.Subject.next (http://dev:3000/vendor.dll.js:673:25) [angular] at BehaviorSubject.next (http://dev:3000/vendor.dll.js:25266:31) [angular] at Router.scheduleNavigation (http://dev:3000/vendor.dll.js:41826:26) [angular] at Router.navigateByUrl (http://dev:3000/vendor.dll.js:41704:21) [angular] at RouterLinkWithHref.onClick (http://dev:3000/vendor.dll.js:42857:21) [angular] at Object.eval [as handleEvent] (ng:///SharedModule/GlobalNavigationComponent.ngfactory.js:225:41) [angular] at handleEvent (http://dev:3000/vendor.dll.js:13281:138) [angular] at callWithDebugContext (http://dev:3000/vendor.dll.js:14489:42) [angular] at Object.debugHandleEvent [as handleEvent] (http://dev:3000/vendor.dll.js:14077:12) [angular] at dispatchEvent (http://dev:3000/vendor.dll.js:10256:21) [angular] at http://dev:3000/vendor.dll.js:10846:38 [angular] at HTMLAnchorElement.<anonymous> (http://dev:3000/vendor.dll.js:18357:53) [angular] at Object.onInvokeTask (http://dev:3000/vendor.dll.js:5592:37) [angular] at ZoneDelegate.invokeTask (http://dev:3000/polyfills.dll.js:4152:36) [angular] at Zone.runTask (http://dev:3000/polyfills.dll.js:3920:47) [<root> => angular] at HTMLAnchorElement.ZoneTask.invoke (http://dev:3000/polyfills.dll.js:4215:38) [<root>] at ____________________Elapsed_9392_ms__At__Wed_Apr_05_2017_17_34_10_GMT_0700__PDT_ (http://localhost) at getStacktraceWithUncaughtError (http://dev:3000/polyfills.dll.js:3628:12) [angular] at new LongStackTrace (http://dev:3000/polyfills.dll.js:3622:22) [angular] at Object.onScheduleTask (http://dev:3000/polyfills.dll.js:3693:18) [angular] at ZoneDelegate.scheduleTask (http://dev:3000/polyfills.dll.js:4133:51) [angular] at Object.onScheduleTask (http://dev:3000/polyfills.dll.js:4029:29) [angular] at ZoneDelegate.scheduleTask (http://dev:3000/polyfills.dll.js:4133:51) [angular] at Zone.scheduleTask (http://dev:3000/polyfills.dll.js:3964:43) [angular] at Zone.scheduleEventTask (http://dev:3000/polyfills.dll.js:3990:25) [angular] at zoneAwareAddListener (http://dev:3000/polyfills.dll.js:5125:14) [angular] at HTMLAnchorElement.addEventListener (eval at createNamedFn (http://dev:3000/polyfills.dll.js:5231:17), <anonymous>:3:43) [angular] at DomEventsPlugin.addEventListener (http://dev:3000/vendor.dll.js:18757:17) [angular] at EventManager.addEventListener (http://dev:3000/vendor.dll.js:18103:23) [angular] at EmulatedEncapsulationDomRenderer2.DefaultDomRenderer2.listen (http://dev:3000/vendor.dll.js:18616:36) [angular] at DebugRenderer2.listen (http://dev:3000/vendor.dll.js:14753:30) [angular] at listenToElementOutputs (http://dev:3000/vendor.dll.js:10835:66) [angular] at createViewNodes (http://dev:3000/vendor.dll.js:13425:17) [angular] at createEmbeddedView (http://dev:3000/vendor.dll.js:13346:5) [angular] at callWithDebugContext (http://dev:3000/vendor.dll.js:14489:42) [angular] at Object.debugCreateEmbeddedView [as createEmbeddedView] (http://dev:3000/vendor.dll.js:14022:12) [angular] at TemplateRef_.createEmbeddedView (http://dev:3000/vendor.dll.js:11684:38) [angular] at ViewContainerRef_.createEmbeddedView (http://dev:3000/vendor.dll.js:11476:52) [angular] at NgIf._updateView (http://dev:3000/vendor.dll.js:22804:45) [angular] at NgIf.set [as ngIf] (http://dev:3000/vendor.dll.js:22763:18) [angular] at updateProp (http://dev:3000/vendor.dll.js:12448:37) [angular] at checkAndUpdateDirectiveInline (http://dev:3000/vendor.dll.js:12145:19) [angular] at checkAndUpdateNodeInline (http://dev:3000/vendor.dll.js:13566:17) [angular] at checkAndUpdateNode (http://dev:3000/vendor.dll.js:13534:16) [angular] at debugCheckAndUpdateNode (http://dev:3000/vendor.dll.js:14163:59) [angular] at debugCheckDirectivesFn (http://dev:3000/vendor.dll.js:14104:13) [angular] at Object.View_GlobalNavigationComponent_1.co [as updateDirectives] (ng:///SharedModule/GlobalNavigationComponent.ngfactory.js:1908:5) [angular] at Object.debugUpdateDirectives [as updateDirectives] (http://dev:3000/vendor.dll.js:14089:21) [angular] at checkAndUpdateView (http://dev:3000/vendor.dll.js:13501:14) [angular] at callViewAction (http://dev:3000/vendor.dll.js:13816:17) [angular] at execEmbeddedViewsAction (http://dev:3000/vendor.dll.js:13788:17) [angular] at checkAndUpdateView (http://dev:3000/vendor.dll.js:13502:5) [angular] at callViewAction (http://dev:3000/vendor.dll.js:13816:17) [angular] at execComponentViewsAction (http://dev:3000/vendor.dll.js:13762:13) [angular] at checkAndUpdateView (http://dev:3000/vendor.dll.js:13507:5) [angular] at callViewAction (http://dev:3000/vendor.dll.js:13816:17) [angular] at execComponentViewsAction (http://dev:3000/vendor.dll.js:13762:13) [angular] at checkAndUpdateView (http://dev:3000/vendor.dll.js:13507:5) [angular] at callWithDebugContext (http://dev:3000/vendor.dll.js:14489:42) [angular] at Object.debugCheckAndUpdateView [as checkAndUpdateView] (http://dev:3000/vendor.dll.js:14029:12) [angular] at ViewRef_.detectChanges (http://dev:3000/vendor.dll.js:11598:63) [angular] at http://dev:3000/vendor.dll.js:6528:63 [angular] at Array.forEach (native) [angular] at ApplicationRef_.tick (http://dev:3000/vendor.dll.js:6528:25) [angular] at ApplicationRef_._loadComponent (http://dev:3000/vendor.dll.js:6504:14) [angular] at ApplicationRef_.bootstrap (http://dev:3000/vendor.dll.js:6492:14) [angular] at http://dev:3000/vendor.dll.js:6272:79 [angular] at Array.forEach (native) [angular] at PlatformRef_._moduleDoBootstrap (http://dev:3000/vendor.dll.js:6272:42) [angular] at http://dev:3000/vendor.dll.js:6234:27 [angular] at Object.onInvoke (http://dev:3000/vendor.dll.js:5601:37) [angular] at Zone.run (http://dev:3000/polyfills.dll.js:3880:43) [angular => angular] at http://dev:3000/polyfills.dll.js:4515:57 [angular] at Object.onInvokeTask (http://dev:3000/vendor.dll.js:5592:37) [angular] at ZoneDelegate.invokeTask (http://dev:3000/polyfills.dll.js:4152:36) [angular] at Zone.runTask (http://dev:3000/polyfills.dll.js:3920:47) [<root> => angular] at drainMicroTaskQueue (http://dev:3000/polyfills.dll.js:4348:35) [<root>] at HTMLDocument.ZoneTask.invoke (http://dev:3000/polyfills.dll.js:4219:25) [<root>] at ____________________Elapsed_62_ms__At__Wed_Apr_05_2017_17_34_10_GMT_0700__PDT_ (http://localhost) at getStacktraceWithUncaughtError (http://dev:3000/polyfills.dll.js:3628:12) [angular] at new LongStackTrace (http://dev:3000/polyfills.dll.js:3622:22) [angular] at Object.onScheduleTask (http://dev:3000/polyfills.dll.js:3693:18) [angular] at ZoneDelegate.scheduleTask (http://dev:3000/polyfills.dll.js:4133:51) [angular] at Object.onScheduleTask (http://dev:3000/polyfills.dll.js:4029:29) [angular] at ZoneDelegate.scheduleTask (http://dev:3000/polyfills.dll.js:4133:51) [angular] at Zone.scheduleTask (http://dev:3000/polyfills.dll.js:3964:43) [angular] at Zone.scheduleMicroTask (http://dev:3000/polyfills.dll.js:3984:25) [angular] at scheduleResolveOrReject (http://dev:3000/polyfills.dll.js:4513:14) [angular] at resolvePromise (http://dev:3000/polyfills.dll.js:4462:21) [angular] at http://dev:3000/polyfills.dll.js:4515:17 [angular] at Object.onInvokeTask (http://dev:3000/vendor.dll.js:5592:37) [angular] at ZoneDelegate.invokeTask (http://dev:3000/polyfills.dll.js:4152:36) [angular] at Zone.runTask (http://dev:3000/polyfills.dll.js:3920:47) [<root> => angular] at drainMicroTaskQueue (http://dev:3000/polyfills.dll.js:4348:35) [<root>] at HTMLDocument.ZoneTask.invoke (http://dev:3000/polyfills.dll.js:4219:25) [<root>] at ____________________Elapsed_1_ms__At__Wed_Apr_05_2017_17_34_10_GMT_0700__PDT_ (http://localhost) at getStacktraceWithUncaughtError (http://dev:3000/polyfills.dll.js:3628:12) [angular] at new LongStackTrace (http://dev:3000/polyfills.dll.js:3622:22) [angular] at Object.onScheduleTask (http://dev:3000/polyfills.dll.js:3693:18) [angular] at ZoneDelegate.scheduleTask (http://dev:3000/polyfills.dll.js:4133:51) [angular] at Object.onScheduleTask (http://dev:3000/polyfills.dll.js:4029:29) [angular] at ZoneDelegate.scheduleTask (http://dev:3000/polyfills.dll.js:4133:51) [angular] at Zone.scheduleTask (http://dev:3000/polyfills.dll.js:3964:43) [angular] at Zone.scheduleMicroTask (http://dev:3000/polyfills.dll.js:3984:25) [angular] at scheduleResolveOrReject (http://dev:3000/polyfills.dll.js:4513:14) [angular] at resolvePromise (http://dev:3000/polyfills.dll.js:4462:21) [angular] at http://dev:3000/polyfills.dll.js:4393:17 [angular] at http://dev:3000/polyfills.dll.js:4586:25 [angular] at Object.onInvoke (http://dev:3000/vendor.dll.js:5601:37) [angular] at Zone.run (http://dev:3000/polyfills.dll.js:3880:43) [angular => angular] at http://dev:3000/polyfills.dll.js:4515:57 [angular] at Object.onInvokeTask (http://dev:3000/vendor.dll.js:5592:37) [angular] at ZoneDelegate.invokeTask (http://dev:3000/polyfills.dll.js:4152:36) [angular] at Zone.runTask (http://dev:3000/polyfills.dll.js:3920:47) [<root> => angular] at drainMicroTaskQueue (http://dev:3000/polyfills.dll.js:4348:35) [<root>] at HTMLDocument.ZoneTask.invoke (http://dev:3000/polyfills.dll.js:4219:25) [<root>] at ____________________Elapsed_0_ms__At__Wed_Apr_05_2017_17_34_10_GMT_0700__PDT_ (http://localhost) at getStacktraceWithUncaughtError (http://dev:3000/polyfills.dll.js:3628:12) [angular] at new LongStackTrace (http://dev:3000/polyfills.dll.js:3622:22) [angular] at Object.onScheduleTask (http://dev:3000/polyfills.dll.js:3693:18) [angular] at ZoneDelegate.scheduleTask (http://dev:3000/polyfills.dll.js:4133:51) [angular] at Object.onScheduleTask (http://dev:3000/polyfills.dll.js:4029:29) [angular] at ZoneDelegate.scheduleTask (http://dev:3000/polyfills.dll.js:4133:51) [angular] at Zone.scheduleTask (http://dev:3000/polyfills.dll.js:3964:43) [angular] at Zone.scheduleMicroTask (http://dev:3000/polyfills.dll.js:3984:25) [angular] at scheduleResolveOrReject (http://dev:3000/polyfills.dll.js:4513:14) [angular] at resolvePromise (http://dev:3000/polyfills.dll.js:4462:21) [angular] at resolvePromise (http://dev:3000/polyfills.dll.js:4438:17) [angular] at http://dev:3000/polyfills.dll.js:4515:17 [angular] at Object.onInvokeTask (http://dev:3000/vendor.dll.js:5592:37) [angular] at ZoneDelegate.invokeTask (http://dev:3000/polyfills.dll.js:4152:36) [angular] at Zone.runTask (http://dev:3000/polyfills.dll.js:3920:47) [<root> => angular] at drainMicroTaskQueue (http://dev:3000/polyfills.dll.js:4348:35) [<root>] at HTMLDocument.ZoneTask.invoke (http://dev:3000/polyfills.dll.js:4219:25) [<root>] at ____________________Elapsed_5_ms__At__Wed_Apr_05_2017_17_34_10_GMT_0700__PDT_ (http://localhost) at getStacktraceWithUncaughtError (http://dev:3000/polyfills.dll.js:3628:12) [angular] at new LongStackTrace (http://dev:3000/polyfills.dll.js:3622:22) [angular] at Object.onScheduleTask (http://dev:3000/polyfills.dll.js:3693:18) [angular] at ZoneDelegate.scheduleTask (http://dev:3000/polyfills.dll.js:4133:51) [angular] at Object.onScheduleTask (http://dev:3000/polyfills.dll.js:4029:29) [angular] at ZoneDelegate.scheduleTask (http://dev:3000/polyfills.dll.js:4133:51) [angular] at Zone.scheduleTask (http://dev:3000/polyfills.dll.js:3964:43) [angular] at Zone.scheduleMicroTask (http://dev:3000/polyfills.dll.js:3984:25) [angular] at scheduleResolveOrReject (http://dev:3000/polyfills.dll.js:4513:14) [angular] at ZoneAwarePromise.then (http://dev:3000/polyfills.dll.js:4602:17) [angular] at RouterInitializer.appInitializer (http://dev:3000/vendor.dll.js:43830:18) [angular] at new ApplicationInitStatus (http://dev:3000/vendor.dll.js:4384:45) [angular] at AppModuleInjector.createInternal (ng:///AppModule/module.ngfactory.js:325:35) [angular] at AppModuleInjector.NgModuleInjector.create (http://dev:3000/vendor.dll.js:5013:76) [angular] at NgModuleFactory.create (http://dev:3000/vendor.dll.js:4986:18) [angular] at http://dev:3000/vendor.dll.js:6224:61 [angular] at Object.onInvoke (http://dev:3000/vendor.dll.js:5601:37) [angular] at Zone.run (http://dev:3000/polyfills.dll.js:3880:43) [<root> => angular] at NgZone.run (http://dev:3000/vendor.dll.js:5470:62) [<root>] at PlatformRef_._bootstrapModuleFactoryWithZone (http://dev:3000/vendor.dll.js:6222:23) [<root>] at http://dev:3000/vendor.dll.js:6263:59 [<root>] at Zone.run (http://dev:3000/polyfills.dll.js:3880:43) [<root> => <root>] at http://dev:3000/polyfills.dll.js:4515:57 [<root>] at Zone.runTask (http://dev:3000/polyfills.dll.js:3920:47) [<root> => <root>] at drainMicroTaskQueue (http://dev:3000/polyfills.dll.js:4348:35) [<root>] at HTMLDocument.ZoneTask.invoke (http://dev:3000/polyfills.dll.js:4219:25) [<root>] defaultErrorLogger @ vendor.dll.js:2560

Update peer dependencies for angular v2.1.1, uninstallable

Parameters

How can one handle parameters when you want to use a fancy name.

For example:
/users/1/settings
/users/2/settings

could not install ng2-breadcrumbs on my Windows machine

Hello,
node v7.10.0
npm v4.2.0
I created folder, then
git clone
npm install
npm start
Log file:
0 info it worked if it ends with ok
1 verbose cli [ 'C:\Program Files\nodejs\node.exe',
1 verbose cli 'C:\Program Files\nodejs\node_modules\npm\bin\npm-cli.js',
1 verbose cli 'start' ]
2 info using [email protected]
3 info using [email protected]
4 verbose run-script [ 'prestart', 'start', 'poststart' ]
5 info lifecycle [email protected]prestart: [email protected]
6 silly lifecycle [email protected]prestart: no script for prestart, continuing
7 info lifecycle [email protected]start: [email protected]
8 verbose lifecycle [email protected]start: unsafe-perm in lifecycle true
9 verbose lifecycle [email protected]start: PATH: C:\Program Files\nodejs\node_modules\npm\bin\node-gyp-bin;D:\bc\ng2-breadcrumb\node_modules.bin;C:\Users\ksn\bin;C:\Program Files\Git\mingw64\bin;C:\Program Files\Git\usr\local\bin;C:\Program Files\Git\usr\bin;C:\Program Files\Git\usr\bin;C:\Program Files\Git\mingw64\bin;C:\Program Files\Git\usr\bin;C:\Users\ksn\bin;C:\windows\system32;C:\windows;C:\windows\System32\Wbem;C:\windows\System32\WindowsPowerShell\v1.0;C:\Users\ksn.dnx\bin;C:\Program Files\Microsoft DNX\Dnvm;C:\Program Files\Microsoft SQL Server\130\Tools\Binn;C:\Program Files\Microsoft\Web Platform Installer;C:\Program Files\Git\cmd;C:\Program Files\Java\jdk1.8.0_101\bin;C:\Ruby23-x64\bin;C:\Program Files (x86)\Skype\Phone;C:\Program Files\nodejs;C:\Program Files\Docker Toolbox;C:\Program Files (x86)\Microsoft VS Code\bin;C:\Users\ksn\AppData\Roaming\npm;C:\Program Files\Git\usr\bin\vendor_perl;C:\Program Files\Git\usr\bin\core_perl
10 verbose lifecycle [email protected]start: CWD: D:\bc\ng2-breadcrumb
11 silly lifecycle [email protected]start: Args: [ '/d /s /c',
11 silly lifecycle 'tsc && concurrently "npm run ngc" "npm run lite" ' ]
12 silly lifecycle [email protected]start: Returned: code: 2 signal: null
13 info lifecycle [email protected]~start: Failed to exec start script
14 verbose stack Error: [email protected] start: tsc && concurrently "npm run ngc" "npm run lite"
14 verbose stack Exit status 2
14 verbose stack at EventEmitter. (C:\Program Files\nodejs\node_modules\npm\lib\utils\lifecycle.js:279:16)
14 verbose stack at emitTwo (events.js:106:13)
14 verbose stack at EventEmitter.emit (events.js:194:7)
14 verbose stack at ChildProcess. (C:\Program Files\nodejs\node_modules\npm\lib\utils\spawn.js:40:14)
14 verbose stack at emitTwo (events.js:106:13)
14 verbose stack at ChildProcess.emit (events.js:194:7)
14 verbose stack at maybeClose (internal/child_process.js:899:16)
14 verbose stack at Process.ChildProcess._handle.onexit (internal/child_process.js:226:5)
15 verbose pkgid [email protected]
16 verbose cwd D:\bc\ng2-breadcrumb
17 error Windows_NT 10.0.10586
18 error argv "C:\Program Files\nodejs\node.exe" "C:\Program Files\nodejs\node_modules\npm\bin\npm-cli.js" "start"
19 error node v7.10.0
20 error npm v4.2.0
21 error code ELIFECYCLE
22 error errno 2
23 error [email protected] start: tsc && concurrently "npm run ngc" "npm run lite"
23 error Exit status 2
24 error Failed at the [email protected] start script 'tsc && concurrently "npm run ngc" "npm run lite" '.
24 error Make sure you have the latest version of node.js and npm installed.
24 error If you do, this is most likely a problem with the ng2-breadcrumb package,
24 error not with npm itself.
24 error Tell the author that this fails on your system:
24 error tsc && concurrently "npm run ngc" "npm run lite"
24 error You can get information on how to open an issue for this project with:
24 error npm bugs ng2-breadcrumb
24 error Or if that isn't available, you can get their info via:
24 error npm owner ls ng2-breadcrumb
24 error There is likely additional logging output above.
25 verbose exit [ 2, true ]

Could you help me to make it work? Thanks

Does this support angular 2 version 4?

I tried upgrading, but noticed the router changed and the breadcrumbs module broke.

exclude certain routes from showing breadcrumbs

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?

Allow to hide breadcrumb for road

Could you add an option on 'hideRoute' and 'hideRouteRegex' to specify to hide completely the breadcrumb ?

I would like to mask it on specific pages, without having to move the HTML tag to each pages.

No provider for Router Error

I followed the instructions by adding Ng2BreadcrumbModule and BreadcrumbService to AppModule and then added the BreadcrumbService to AppComponent.

However, when running the app I get an error:

EXCEPTION: Error in ./AppComponent class AppComponent - inline template:0:45 caused by: No provider for Router!

Errors while AOT-Compiling

I got the following errors while compiling the project with AOT.
Error at ./node_modules/ng2-breadcrumb/app/components/breadcrumbService.ts:8:46: Parameter 'string' implicitly has an 'any' type.
Error at ./node_modules/ng2-breadcrumb/app/components/breadcrumbService.ts:8:84: Parameter 'string' implicitly has an 'any' type.
Error at ./node_modules/ng2-breadcrumb/app/components/breadcrumbService.ts:9:51: Parameter 'string' implicitly has an 'any' type.
Error at ./node_modules/ng2-breadcrumb/app/components/breadcrumbService.ts:9:89: Parameter 'string' implicitly has an 'any' type.
Error at ./node_modules/ng2-breadcrumb/app/components/breadcrumbService.ts:110:39: Parameter 'value' implicitly has an 'any' type.

I have corrected them myself but maybe you could also correct them to be in the next version.

Query Parameters Handling

Is there a way to handle query parameter? Or I really need add FriendlyName for all route to prevent display the query parameter on breadcrumb??

Path:
/product/list?foo=bar

Breadcrumb display:
Product / list?foo=bar

ng2-breadcrumb error once included in app.module.ts

Getting this error:

/repo/my_project/node_modules/ng2-breadcrumb/app/components/breadcrumbService.ts:90:29
Property 'includes' does not exist on type 'string[]'.

including into app.module like so..

import { Ng2BreadcrumbModule, BreadcrumbService } from 'ng2-breadcrumb/ng2-breadcrumb'

imports: [
Ng2BreadcrumbModule,

providers: [
BreadcrumbService,

Can not integrate ng2-breadcrumb

when I do this
import {Ng2BreadcrumbModule, BreadcrumbService} from 'ng2-breadcrumb/ng2-breadcrumb';

it shows import error.
So I added those path in my systemjs.config.js like this.
System.config({
paths: {
'npm:': 'node_modules/'
},
// map tells the System loader where to look for things
map: {
"ng2-breadcrumb/ng2-breadcrumb": "npm:ng2-breadcrumb/ng2-breadcrumb",
},
packages: {
"npm:ng2-breadcrumb": {defaultExtension: 'js'},
}
});

any clue??

Using Service to get user friendly name in getNameForUser method for addCallbackForRouteRegex function.

I am using the following code to give a friendly name for the user id:

breadcrumbService.addCallbackForRouteRegex('/user-profile/[0-9]*$', this.getNameForUser);
getNameForUser(id:string):string {
// Here i want to use service to fetch user name.
username = this.userDetailService.getUserName(id); // userDetailService is given in the constructor
return username ;
}

I am getting the following error:
TypeError: Cannot read property 'userDetailService' of undefined at webpackJsonp.582.AppComponent.getNameForUser

Is there any way to user external services in the getNameForUser method

canActivate in guards returns the target route even if it returns false

Breadcrumb showing the target route even if the route guard returns false.

canActivate() {
    if (!_.isEmpty(user.account) && !_.isEmpty(user.role)) {
      return true
    }
    else {
      this.router.navigate(['/switch-account'])
      return false
    }
  }

Url parameters gets added to breadcrumbs

I found that parameters, the ones that use ? and & gets added to the breadcrumbs. So if you have /admin?user=kalle this will be shown in the trail.

Error while building dll

vagrant@tsm:/workspace/hulladektozsde/client/admin$ ./node_modules/.bin/ng-cli build dll
Creating bundles...
Creating DLL build...
Hash: f6003d7c6f55fb813e70                                                                 
Time: 8883ms
chunk    {0} vendor.dll.js (vendor) 4.79 MB [entry] [rendered]
chunk    {1} polyfill.dll.js (polyfill) 656 kB [entry] [rendered]
chunk    {2} styles.dll.js (styles) 283 kB [entry] [rendered]

ERROR in dll vendor
Module not found: Error: Can't resolve 'ng2-breadcrumb' in '/workspace/hulladektozsde/client/admin'
resolve 'ng2-breadcrumb' in '/workspace/hulladektozsde/client/admin'
  Parsed request is a module
  using description file: /workspace/hulladektozsde/client/admin/package.json (relative path: .)
    Field 'browser' doesn't contain a valid alias configuration
  after using description file: /workspace/hulladektozsde/client/admin/package.json (relative path: .)
    resolve as module
      looking for modules in /workspace/forks/ng-cli/node_modules
        using description file: /workspace/forks/ng-cli/package.json (relative path: ./node_modules)
          Field 'browser' doesn't contain a valid alias configuration
        after using description file: /workspace/forks/ng-cli/package.json (relative path: ./node_modules)
          using description file: /workspace/forks/ng-cli/package.json (relative path: ./node_modules/ng2-breadcrumb)
            as directory
              /workspace/forks/ng-cli/node_modules/ng2-breadcrumb doesn't exist
            no extension
              Field 'browser' doesn't contain a valid alias configuration
              /workspace/forks/ng-cli/node_modules/ng2-breadcrumb doesn't exist
            .js
              Field 'browser' doesn't contain a valid alias configuration
              /workspace/forks/ng-cli/node_modules/ng2-breadcrumb.js doesn't exist
            .ts
              Field 'browser' doesn't contain a valid alias configuration
              /workspace/forks/ng-cli/node_modules/ng2-breadcrumb.ts doesn't exist
            .json
              Field 'browser' doesn't contain a valid alias configuration
              /workspace/forks/ng-cli/node_modules/ng2-breadcrumb.json doesn't exist
      looking for modules in /workspace/hulladektozsde/client/admin/node_modules
        using description file: /workspace/hulladektozsde/client/admin/package.json (relative path: ./node_modules)
          Field 'browser' doesn't contain a valid alias configuration
        after using description file: /workspace/hulladektozsde/client/admin/package.json (relative path: ./node_modules)
          using description file: /workspace/hulladektozsde/client/admin/node_modules/ng2-breadcrumb/package.json (relative path: .)
            no extension
              Field 'browser' doesn't contain a valid alias configuration
              /workspace/hulladektozsde/client/admin/node_modules/ng2-breadcrumb is not a file
            .js
              Field 'browser' doesn't contain a valid alias configuration
              /workspace/hulladektozsde/client/admin/node_modules/ng2-breadcrumb.js doesn't exist
            .ts
              Field 'browser' doesn't contain a valid alias configuration
              /workspace/hulladektozsde/client/admin/node_modules/ng2-breadcrumb.ts doesn't exist
            .json
              Field 'browser' doesn't contain a valid alias configuration
              /workspace/hulladektozsde/client/admin/node_modules/ng2-breadcrumb.json doesn't exist
            as directory
              existing directory
                using path: /workspace/hulladektozsde/client/admin/node_modules/ng2-breadcrumb/index
                  using description file: /workspace/hulladektozsde/client/admin/node_modules/ng2-breadcrumb/package.json (relative path: ./index)
                    no extension
                      Field 'browser' doesn't contain a valid alias configuration
                      /workspace/hulladektozsde/client/admin/node_modules/ng2-breadcrumb/index doesn't exist
                    .js
                      Field 'browser' doesn't contain a valid alias configuration
                      /workspace/hulladektozsde/client/admin/node_modules/ng2-breadcrumb/index.js doesn't exist
                    .ts
                      Field 'browser' doesn't contain a valid alias configuration
                      /workspace/hulladektozsde/client/admin/node_modules/ng2-breadcrumb/index.ts doesn't exist
                    .json
                      Field 'browser' doesn't contain a valid alias configuration
                      /workspace/hulladektozsde/client/admin/node_modules/ng2-breadcrumb/index.json doesn't exist
                use ./ng2-bootstrap.js from main in package.json
                  using description file: /workspace/hulladektozsde/client/admin/node_modules/ng2-breadcrumb/package.json (relative path: .)
                    Field 'browser' doesn't contain a valid alias configuration
                  after using description file: /workspace/hulladektozsde/client/admin/node_modules/ng2-breadcrumb/package.json (relative path: .)
                    using description file: /workspace/hulladektozsde/client/admin/node_modules/ng2-breadcrumb/package.json (relative path: ./ng2-bootstrap.js)
                      as directory
                        /workspace/hulladektozsde/client/admin/node_modules/ng2-breadcrumb/ng2-bootstrap.js doesn't exist
                      no extension
                        Field 'browser' doesn't contain a valid alias configuration
                        /workspace/hulladektozsde/client/admin/node_modules/ng2-breadcrumb/ng2-bootstrap.js doesn't exist
                      .js
                        Field 'browser' doesn't contain a valid alias configuration
                        /workspace/hulladektozsde/client/admin/node_modules/ng2-breadcrumb/ng2-bootstrap.js.js doesn't exist
                      .ts
                        Field 'browser' doesn't contain a valid alias configuration
                        /workspace/hulladektozsde/client/admin/node_modules/ng2-breadcrumb/ng2-bootstrap.js.ts doesn't exist
                      .json
                        Field 'browser' doesn't contain a valid alias configuration
                        /workspace/hulladektozsde/client/admin/node_modules/ng2-breadcrumb/ng2-bootstrap.js.json doesn't exist
[/workspace/hulladektozsde/client/admin/node_modules/ng2-breadcrumb]
[/workspace/hulladektozsde/client/admin/node_modules/ng2-breadcrumb.js]
[/workspace/hulladektozsde/client/admin/node_modules/ng2-breadcrumb.ts]
[/workspace/hulladektozsde/client/admin/node_modules/ng2-breadcrumb.json]
[/workspace/forks/ng-cli/node_modules/ng2-breadcrumb]
[/workspace/forks/ng-cli/node_modules/ng2-breadcrumb]
[/workspace/forks/ng-cli/node_modules/ng2-breadcrumb.js]
[/workspace/forks/ng-cli/node_modules/ng2-breadcrumb.ts]
[/workspace/forks/ng-cli/node_modules/ng2-breadcrumb.json]
[/workspace/hulladektozsde/client/admin/node_modules/ng2-breadcrumb/index]
[/workspace/hulladektozsde/client/admin/node_modules/ng2-breadcrumb/index.js]
[/workspace/hulladektozsde/client/admin/node_modules/ng2-breadcrumb/index.ts]
[/workspace/hulladektozsde/client/admin/node_modules/ng2-breadcrumb/index.json]
[/workspace/hulladektozsde/client/admin/node_modules/ng2-breadcrumb/ng2-bootstrap.js]
[/workspace/hulladektozsde/client/admin/node_modules/ng2-breadcrumb/ng2-bootstrap.js]
[/workspace/hulladektozsde/client/admin/node_modules/ng2-breadcrumb/ng2-bootstrap.js.js]
[/workspace/hulladektozsde/client/admin/node_modules/ng2-breadcrumb/ng2-bootstrap.js.ts]
[/workspace/hulladektozsde/client/admin/node_modules/ng2-breadcrumb/ng2-bootstrap.js.json]
 @ dll vendor

Support for RC.3

Hi Gerhard Mostert,

I have updated the repo to support for angular2.RC3. it is tested. It would be great if I could upload to your repo and create PR.

Can not run with webpack?

Hi!
You missing "]" in src/breadcumb/breadcumb.ts in line 42
And
When i run it show this error
error TS2339: Property 'getOwnMetadata' does not exist on type 'typeof Reflect'.

Regex not working for strings

When I have this url: /admin/dashboard/models-brands/9/models

This works:

breadcrumbs.addFriendlyNameForRouteRegex('/admin/dashboard/models-brands/[0-9]/models', 'Modeller');

These however never works if I have an url that's /admin/dashboard/models-brands/volvo/models:

breadcrumbs.addFriendlyNameForRouteRegex('/admin/dashboard/models-brands/[a-z]/models', 'Modeller');

breadcrumbs.addFriendlyNameForRouteRegex('/admin/dashboard/models-brands/[a-z0-9]/models', 'Modeller');

breadcrumbs.addFriendlyNameForRouteRegex('/admin/dashboard/models-brands/[a-zA-Z0-9]/models', 'Modeller');

I've also tried using ^ and $ as per the examples you've provided but it doesn't work either.

Any idea why?

EDIT: I guess this is a global selector issue, how would I match more than one character here? I can't get the /g to work.

Hide any path not allowed in the breadcrumb

Hi, i´m using the breadcrumb and when i give a random route, like 'dsadsad' and the page is using a path like
{ path: '**', component: PagenotfoundComponent }
the breadcrumb shows dsadsad,
we want to hide any path like this.
i have use
`import { Component, OnInit } from '@angular/core';
import {BreadcrumbService} from 'ng2-breadcrumb/ng2-breadcrumb';

@component({
selector: 'app-pagenotfound',
templateUrl: './pagenotfound.component.html',
styleUrls: ['./pagenotfound.component.css'],
providers: [BreadcrumbService]
})
export class PagenotfoundComponent implements OnInit {

constructor(
private breadcrumbService: BreadcrumbService
) { }

ngOnInit() {
this.breadcrumbService.hideRoute('/a-zA-Z09');
}

}`
in the app.modules we import the module like this

import {Ng2BreadcrumbModule} from 'ng2-breadcrumb/ng2-breadcrumb';

any ideas? the path still showing.

Thanks.

Support readonly/deactivate for route

We have some routes, that contain non navigatable paths.
I.e.

Overview > Record Nr. 1 > Contact Info > Address

Here Record Nr. 1 isn't a route that can be navigated to. So instead of hiding it, we would like to make it readonly/deactivated (= non clickable). Is there a workaround or planned feature for this?

Thanks!

Add a prefix

Give the option to set a prefix as the first breadcrumb so that it can be set to the app title.

Property 'includes' does not exist

Hi,

I'm trying to use ng2-breadcrumb, but I got this error in the console :

ng2-breadcrumb\app\components\breadcrumbService.ts:90:29
Property 'includes' does not exist on type 'string[]'

Any idea to solve this ?

Thanks in advance.

EDIT : I'm working with angular-cli. In my tsconfig.json file, in the compilerOptions, there was :
"lib": ["es7", "dom"].
But I need to put es6 instead of es7, else my project is not working any more. With es7, no more errors for your lib, but with es6 I got the error reported below.
Can you fix this ?

AoT compilation raises error

I'm trying to implement AoT compilation but I'm getting error:

Error: Unexpected value 'Ng2BreadcrumbModule' imported by the module 'SharedModule'
    at /home/guskis/Projects/web/node_modules/@angular/compiler/bundles/compiler.umd.js:12304:33
    at Array.forEach (native)
    at CompileMetadataResolver._loadNgModuleMetadata (/home/guskis/Projects/web/node_modules/@angular/compiler/bundles/compiler.umd.js:12289:51)
    at CompileMetadataResolver.getUnloadedNgModuleMetadata (/home/guskis/Projects/web/node_modules/@angular/compiler/bundles/compiler.umd.js:12265:23)
    at addNgModule (/home/guskis/Projects/web/node_modules/@angular/compiler/bundles/compiler.umd.js:17275:43)
    at /home/guskis/Projects/web/node_modules/@angular/compiler/bundles/compiler.umd.js:17286:16
    at Array.forEach (native)
    at _createNgModules (/home/guskis/Projects/web/node_modules/@angular/compiler/bundles/compiler.umd.js:17285:28)
    at analyzeNgModules (/home/guskis/Projects/web/node_modules/@angular/compiler/bundles/compiler.umd.js:17182:16)
    at analyzeAndValidateNgModules (/home/guskis/Projects/web/node_modules/@angular/compiler/bundles/compiler.umd.js:17186:20)
Compilation failed

Shared module:

@NgModule({
  imports: [
    Ng2BreadcrumbModule,
    // ...
  ],
  exports: [
    Ng2BreadcrumbModule,
    // ...
  ],
  providers: [
    BreadcrumbService,
    // ...
  ]
})

Remove angular2-in-memory-web-api dependency

angular2-in-memory-web-api is unused and depends on Angular 2 packages, resulting in warnings from npm.

npm WARN [email protected] requires a peer of @angular/core@^2.0.0 but none was installed.
npm WARN [email protected] requires a peer of @angular/http@^2.0.0 but none was installed.
npm WARN [email protected] requires a peer of [email protected] but none was installed.
npm WARN [email protected] requires a peer of zone.js@^0.6.25 but none was installed.

How to cancel breadcrumb update

Hi,

I have created a warning popup to prevent user from losing there changes when we leave the page. To do so I have used a guard that implement "canDeactivate".
But when I am clicking the breadcrumb links and cancelling the navigation, the breadcrumb state change like the navigation has been done.

How to fix that ?

ie does not support "includes"

on ie11: TypeError: Object doesn't support property or method 'includes'
likely from the service because ie does not have support for includes.

Doesn't work?

When I added this to my project by following your instructions, and try to run it I get errors.
"angular2-polyfills.js:127 GET http://localhost:2512/ng2-breadcrumb/ng2-breadcrumb.js 404 (Not Found)"

I suspect the issue is the last step of your instructions which reads "To compile the project locally just run the default gulp task:" - but you don't supply a gulp file and I have no Idea what you have defined in your default task. My gulp file does not have a default task definded and I can't create it because I don't know what you want it to do.

Feature: Possibility to change separator sign

If I look at the code, I guess the "/" sign between two elements of the breadcrumb isn't adjustable for the moment.
Would it be possible to change this sign as with an external input?
This way you could for example, use ">" or "|" or even ":" instead of "/"

Callback function with route parameters does not work as documented

When I do this

breadcrumbService.addCallbackForRoute('/home/users/1', this.getNameForUser);
breadcrumbService.addCallbackForRouteRegex('^/home/users/[0-9]$', this.getNameForUser);

getNameForUser(id:string):string {
    return 'specific name for user with id';
}

C&P from the documentation, I get an error

Argument of type '(id: string) => string' is not assignable to parameter of type '() => string'.

Is this intentional? Looks as if the "regex"-Functions only accept parameterless functions for the callback.

Does not work with "@angular/router": "3.0.0-alpha.7"

Make the 'breadcrumb' class optionally added.

I have bootstrap in my project, but I don't want this component to use their style. It's really annoying to need to try and overwrite every bootstrap provided style if you don't want it.

You should be able to specify if you want to use bootstrap on the directive itself.

<breadcrumb [bootstrap]='true'></breadcrumb>

Why is not installing?

npm install ng2-breadcrumb --save

[email protected]

npm WARN optional Skipping failed optional dependency /chokidar/fsevents:
npm WARN notsup Not compatible with your operating system or architecture: [email protected]
npm WARN [email protected] No description
npm WARN [email protected] No repository field.

Error while using lazy loading

Angular throws an
Cannot read property 'lastIndexOf' of undefined TypeError: Cannot read property 'lastIndexOf' of undefined Error when trying to access a lazy loaded url.

Loading directly a lazy loaded url works, but after accessing one after the app is started it throws an error.

Does anyone know a solution for this problem? I think I am not the only one with this problem.

add Friendly Names For Routes with parameters

How to add friendlyNames to routes with parameters for example when I do this:

    breadcrumbService.addFriendlyNameForRoute('/comp1', 'home');

It works just perfect, but if I do this:

    breadcrumbService.addFriendlyNameForRoute('/comp1/:id', 'details');

It seems like it doesn´t work

Am I doing something wrong?

Thanks !

Separate CSS

Just a suggestion... I suppose this is just preference, but I'd rather have the styles be in a separate css file, so I can bundle/minify it with my other styles, and not have a style element in the head. I'm new to Ng2, so your code is helpful to see. Thanks!

Really needs to be able to resolve name from params

Rather than synchronous callback, it really needs to be able to return an Observable/Promise.

Breadcrumbs with multiple parameters not working

I'm trying to generate breadcrumbs for 'Dashboard/Store/:id/:type/:source/:sourceDate' when I use addCallbackForRoute function it is unable to to distinguish the path param values and actual route path. for the above example i was able to generate Dashboard/Store/123/typevalue/sourcevalue/01 mar 2013.
I tried addCallbackForRouteRegex it resulted in following Dashboard/Store/custom message for id/custom message for type/ custom message for type/message for date

ideally expected should be : 'Dashboard/Store-Custom message reading path param'
how do I achieve this?
thanks in advance

Rendering issue when using localization

Hi,
I am working on multi-culture angular web app and to get culture in URL I am using

https://github.com/Greentube/localize-router

But found that the current selected culture appear in the breadcrumb component like this:
Home / En / Campaigns

Is there any way to remove the culture from the breadcrumb ?

thanks

Unable to add module to application

Hi! I tried to add this package to my application following the README:

import {Ng2BreadcrumbModule, BreadcrumbService} from 'ng2-breadcrumb/ng2-breadcrumb';

@NgModule({
    imports: [Ng2BreadcrumbModule],
    providers: [BreadcrumbService]
})
export class AppModule {
    ...
}

However, when I open the page, I receive this error:

Uncaught Error: Unexpected value 'Ng2BreadcrumbModule' imported by the module 'AppModule'

    at http://localhost/build/app.js:22183:35
    at Array.forEach (native)
    at CompileMetadataResolver.getNgModuleMetadata (http://localhost/build/app.js:22168:44)
    at RuntimeCompiler._compileComponents (http://localhost/build/app.js:35048:47)
    at RuntimeCompiler._compileModuleAndComponents (http://localhost/build/app.js:34986:37)
    at RuntimeCompiler.compileModuleAsync (http://localhost/build/app.js:34977:21)
    at PlatformRef_._bootstrapModuleWithZone (http://localhost/build/app.js:24632:25)
    at PlatformRef_.bootstrapModule (http://localhost/build/app.js:24614:21)
    at Object.<anonymous> (http://localhost/build/app.js:116900:53)
    at __webpack_require__ (http://localhost/build/app.js:654:30)(anonymous function) @ metadata_resolver.js:227CompileMetadataResolver.getNgModuleMetadata @ metadata_resolver.js:212RuntimeCompiler._compileComponents @ runtime_compiler.js:126RuntimeCompiler._compileModuleAndComponents @ runtime_compiler.js:64RuntimeCompiler.compileModuleAsync @ runtime_compiler.js:55PlatformRef_._bootstrapModuleWithZone @ application_ref.js:302PlatformRef_.bootstrapModule @ application_ref.js:284(anonymous function) @ main.ts:3__webpack_require__ @ bootstrap 66b5bbd…:653(anonymous function) @ bootstrap 66b5bbd…:700(anonymous function) @ bootstrap 66b5bbd…:700

Am I doing anything wrong?

Nested router configs

I can't see anything in the source that would handle nested router configs. Any thoughts on this?

Does it support Angular 2.1.0?

Does it support Angular 2.1.0?

issues with @angular/router 4.2.0 ?

Upgraded to angular 4.2.0, and the breadcrumb has just vanished from the ui. An examination of the dom reveals no ul's

Anyone else seen this problem ?

<breadcrumb _ngcontent-c1="" class="flat" ng-reflect-use-bootstrap="false">
        <ul>
            <!--bindings={
                "ng-reflect-ng-for-of": ""
               }-->
        </ul>
    </breadcrumb>

Failed at the [email protected] postinstall script 'typings install'.

Hi,

your component looks very promising to solve an ugly issue ;)

Nonetheless I've got problems installing it. I dont want to use typings in my project. Because we already schwitched to @types (https://www.npmjs.com/~types)

So is there a possiblity to use it without installing the typings or typings in general?

Support for Angular 2.0.0

Any plans to support this for the new final release of Angular 2.0.0? Looks like a great module.

Separate HTML

Just as the CSS the HTML should also be split into a separate file to follow the official style guide.

Property 'getOwnMetadata' does not exist on type 'typeof Reflect'.

Hi, I am using angular 2 beta 8 and I got this error from the constructor:

Property 'getOwnMetadata' does not exist on type 'typeof Reflect'.

I use gulp-typescript for compiling.

Please help. Thank you.

Rex

Unsubscribe to router in onDestroy

I'm not sure if you have considered this but not unsubscribing could potentially cause memory leaks.

TSLINT issues

When implementing this, TSLINT complaining about errors in code. Makes this unusable for me. So far I don't believe there is a way to tell TSLINT to ignore the node_modules folder.