Snippet

Angular Route Information

AOAnonymous One· Sep 1, 20221 min read
  • #Angular
  • #TypeScript
  • #Routing

Angular Route Information

Use Angular Activated Route to get desired information from URL.

const routes: Routes = [
  { path: 'first-component/:name', component: FirstComponent },
];

First one from the Official Angular Documentation: 

import { ActivatedRoute } from '@angular/router';
...
constructor(
  private route: ActivatedRoute,
) {}
...
ngOnInit() {
  this.route.queryParams.subscribe(params => {
    this.name = params['name'];
  });
}

Second method:

import { ActivatedRoute } from '@angular/router';
...
constructor(
  private route: ActivatedRoute,
) {}
...
ngOnInit() {
  const name = this.route.snapshot.paramMap.get('name').toLowerCase();
}

Pass Information through Router State

In the navigating component to send data

this.router.navigateByUrl(
      `${nav_path.adminAddSubCategory}`,
      {state: {parent: parentCategoryPath}}
    )

In the receiving data component

constructor(
) {
    this.parentCategory = history.state.parent;

  }

0 Comments

Sign in to join the conversation.

Search

Jump to a page, story or project