angular-routing

I got a routing for my user profiles in Angular4 /* Frame Default */ { path: '', component: FrameDefaultComponent, children: [ {path: 'home', component: SiteHomeComponent}, {path: 'home/:page', component: SiteHomeComponent}, { path: 'user/:id', component: SiteUserProfileComponent, children: [ {path: '', redirectTo: 'home', pathMatch: 'full'}, {path: 'home', component: SiteUserProfileHomeComponent}, {path: 'about', component: SiteUserProfileAboutComponent} ] }, { path: 'user/settings', component: SiteUserSettingsComponent, children: [ {path: '', redirectTo: 'home', pathMatch: 'full'}, {path:

I'm trying to implement a site with two main content 'panes' (imagine two columns each half the width of the page). The panes should be able to change independent of each other and have their own controllers and be able to pass data between each other (so the user can navigate through a bunch of pages on the left pane while the right pane stays the same without reloading and vice versa, and a change in the left pane can update data showing up in the right pane). I've looked through a bunch of examples/tutorials on UI Router but can't seem to find a good example of how to implement what I'm

I have a angular 4 application. There i use JWT token for authentication purposes. Everything works fine. but the token expiration time i have given to the JWT toke is 1 hour. i want to log the user out from the front end application once the token expired in the server side. in node backend i use express middlewere to hanndle this by checking if all the requests contain a valid token. Is there a way to do this angular side as well? You can use Http Interceptors. If any Unauthorized 401 response. Suppose you are sending a http request with token in header. your server side code check your

I've just started learning Angular2 and I want to build a very common "list-detail" style page similar to this: http://xgrommx.github.io/rx-book/index.html . When you click an item in left-bar it initiates a navigation to the center detail view without tearing down the left-bar. What's the best way to achieve this effect? My current design is like the following: When I start the home component, the list component(child1) will load immediately and it will call an external API to fetch the names (only names) of a list of items. When clicking a item name on the left, it will create a new Detail

My code for that is as shown below: googleClick(): void { this._auth.login('google').subscribe( (data: any) => { console.log('google server data ' + JSON.stringify(data)); this.loginService.registerUser(data.email, data.name, '0').subscribe(res => { if (res.status === '200') { this.storage.store('user_token', res.data.user_token); this.storage.store('user_email', data.email); this.storage.store('user_img', data.image); this.storage.store('user_first_name', res.data.user_name); this.storage.store('user_id', res.data._id); this.storage.store('user_paltform_login', 0); this.router.navigate(['