angular2-routing

I am attempting to create portal like functionality with angular 2 which will provide base navigation and global services such as authentication, but allow other developers to create their own modules which fundamentally plug into the portal. I am using angular-cli and have made a quick proof of concept with the modules being created inside the project (see tree below) which are lazy loaded in app.module via the router (with loadChildren). Each child module has its own router and is fundamentally decoupled from the parent portal (app.module). I ultimately want to move these child modules into

I have some components of which one with dynamic routes. the dynamic routes are added as, let config = []; for(let i = 0; i < this.pages.length; i++) { config.push({ path: this.pages[i].slug, name : this.pages[i].name, component: AnotherComponent, }); } router.config(config); whenever the component with dynamic route is loaded more than once, the routes are configured again and that results in configuration conflict. Here's the plunk , The dynamic routes are loaded with the link users , clicking again on users after navigating away from user logs the below shown error to the console. How do I

Does anyone know why link #1 and #2 work but link #3 doesn't? <a [routerLink]="['/contact']">Contact Solo</a> | <a [routerLink]="[{ outlets: { aux: 'aside' }}]">Aux Solo</a> | <a [routerLink]="['/contact', { outlets: { aux: 'aside' }}]">Contact + Aux</a> <router-outlet></router-outlet> <router-outlet name="aux"></router-outlet> In other words: I can activate the primary route individually (link #1), I can activate the auxiliary route individually (link #2), but I can't activate the primary route AND the auxiliary route simultaneously (link #3). Link #3 only activates the primary route but

I'm upgrading my Angular2 app from 2.0.0 to 2.3.0, and I'm running into the following error. Any ideas as to why? I saw this other post ( Angular 2.0.1 Router EmptyError: no elements in sequence ), but after trying this, the issue still remains. What causes this error? Error: Uncaught (in promise): EmptyError: no elements in sequence Error: no elements in sequence at EmptyError.ZoneAwareError (zone.js:672) at new EmptyError (EmptyError.ts:13) at FirstSubscriber._complete (first.ts:161) at FirstSubscriber.Subscriber.complete (Subscriber.ts:122) at Subject._subscribe (Subject.ts:109) at Subject

I sometimes have a component that can receive text like this: text www.website.com But I would like to convert it to a url if it is a link. Like this. text www.website.com I read this SO answer that suggests using 3rd party libs such as anchorme . Is there anywway to do it the angular2 way? There are numerous problems with using simple regexes to modify HTML content. Here's an approach that uses the linkifyjs module, which you need to npm install . Do notice that the input is considered plain text, while output is HTML text. import { Pipe, PipeTransform } from '@angular/core'; import

Need to hide link in menu based on the "routerLink" after check ACL access. I do not want to use angular directives "*ngIf" on each element link in app (need to do that globaly on the routerConfig definition) Content can controll using annotation @CanActivate on components but need to hide link in menu I try do that with overwrite "routerLink" directive, but in this directives after overwrite can't get access to my extends param defined(resources and privilages) in routerConfig Example: @Component({}) @RouteConfig([{ path: '/dashboard', name: 'Dashboard', component: DashboardComponent, data: {

Is there any way to configure Angular2 router to redirect to specific route, if invalid path is entered? For example if I have three routes: /home /about /404 and I enter /trains (a route, not present in route config), I'd like the router to redirect me to 404. Update for new @angular/router The new router handles missing routes much nicer with the '**' path specification. In your root RouterConfig , adding a component as a catch-all will catch incorrect routes at the root level and within any nested children as well which means you only need to include it at the very top level. Taking the ng2

Given this url structure (over which I have no control), how can I retrieve the hash fragment using Angular2? http://your-redirect-uri#access_token=ACCESS-TOKEN My router does route to the correct component, but everything after oauth get scrapped and I can't find the hash fragment in request.params or location.path. Doomed?? Router config: @RouteConfig([ {path: '/welcome', name: 'Welcome', component: WelcomeComponent, useAsDefault: true}, {path: '/landing/oauth', name: 'Landing', component: LandingComponent} // this one ]) For those still looking : import { ActivatedRoute } from '@angular

I have an angular 2 application in which I need to be authenticated on every page. So I have implemented a custom RouterOutlet to confirm I am logged in on every page change. @Directive({ selector: 'auth-outlet' }) export class AuthOutlet extends RouterOutlet { publicRoutes: any; private parentRouter: Router; private authService: AuthService; constructor(_elementRef: ElementRef, _loader: DynamicComponentLoader, _parentRouter: Router, @Attribute('name') nameAttr: string, _authService: AuthService) { super(_elementRef, _loader, _parentRouter, nameAttr); this.parentRouter = _parentRouter; this