angular2-routing – Page 6

Angular router: how to replace param?

May 4, 2023 by Tarik

To navigate to particular link from current url, you can do something like this, constructor(private route: ActivatedRoute, private router: Router){} ngOnInit() { this.route.params.subscribe(params => { // PARAMS CHANGED .. let id = params[‘projectid’]; }); } navigate(){ this.router.navigateByUrl(this.router.url.replace(id, newProjectId)); // replace parameter of navigateByUrl function to your required url } On ngOnInit function, we have subscribed … Read more

angular 2 azure deploy refresh error : The resource you are looking for has been removed, had its name changed, or is temporarily unavailable

April 30, 2023 by Tarik

Navigating to the same route not refreshing the component?

April 29, 2023 by Tarik

If only the params has changes the component itself won’t be initialize again. But you can subscribe to changes in the parameters that you send. For example on ngOnInit method you can do something like this: ngOnInit() { this.sub = this.route.params.subscribe(params => { const term = params[‘term’]; this.service.get(term).then(result => { console.log(result); }); }); }

How can I access an activated child route’s data from the parent route’s component?

April 27, 2023 by Tarik

First child will give you access to data constructor(route: ActivatedRoute) { route.url.subscribe(() => { console.log(route.snapshot.firstChild.data); }); }

How do I detect user navigating back in Angular2?

April 27, 2023 by Tarik

EDIT Please don’t do this. The official docs say “This class should not be used directly by an application developer. Instead, use Location.” Ref: https://angular.io/api/common/PlatformLocation It’s possible to use PlatformLocation which has onPopState listener. import { PlatformLocation } from ‘@angular/common’ (…) constructor(location: PlatformLocation) { location.onPopState(() => { console.log(‘pressed back!’); }); } (…)

How to get current route custom data in angular 2?

April 26, 2023 by Tarik

public constructor(private route:ActivatedRoute, private router:Router) { console.log(route.snapshot.data[‘title’]) }

Angular 2 routerLinkActive always active for base path

April 22, 2023 by Tarik

As suggested by @TomRaine in this answer, you can add the property [routerLinkActiveOptions]=”{ exact: true }” to your element: <nav> <a [routerLink]=”[“https://stackoverflow.com/”]” [routerLinkActive]=”[‘nav-active’]” [routerLinkActiveOptions]=”{ exact: true }”> HOME </a> … </nav>

Retrieve hash fragment from url with Angular2

April 19, 2023 by Tarik

For those still looking : import { ActivatedRoute } from ‘@angular/router’; export class MyComponent { constructor( private route: ActivatedRoute, ) { } myfunction(){ this.route.fragment.subscribe((fragment: string) => { console.log(“My hash fragment is here => “, fragment) }) } }

Angular2 – Redirect to calling url after successful login

April 12, 2023 by Tarik

There’s a tutorial in the Angular Docs, Milestone 5: Route guards. One possible way to achieve this is by using your AuthGuard to check for your login status and store the url on your AuthService. AuthGuard import { Injectable } from ‘@angular/core’; import { CanActivate, Router, ActivatedRouteSnapshot, RouterStateSnapshot } from ‘@angular/router’; import { AuthService } … Read more

How can I improve load performance of Angular2 apps?

April 7, 2023 by Tarik

A single page application generally takes more time while loading as it loads all necessary things at once. I had also faced same problem and my team has optimized our project from loading in 8 seconds to 2 seconds by using following methods. Lazy loading a module : Lazy loading modules helps to decrease the … Read more