Angular 2 pass parameters in Routes

Question

Is it possible to pass parameters in the routes like the example here - params: ['parameters']

I dont mean pass data in the Url but when I'm on pageone I can access the params in the route for this view.

import { RouterModule, Routes } from "@angular/router";
import { HomeComponent } from "../app/home.component";
import { PageOneComponent } from "../app/pageone.component";
import { AppComponent } from "../app/app.component";

const mainRoutes: Routes = [
    {
        path: "",
        component: AppComponent,
        resolve: {
            app: AppResolverService
        },
        children: [
            {
                path: "",
                component: HomeComponent
            },
            {
                path: "/pageone",
                component: PageOneComponent
                params: ['parameters']
            },
        ]
    }
];

export const MAIN_ROUTE_MODULE = RouterModule.forRoot(mainRoutes);

Answer 1

You need to use another way to pass parameters.

Checkout this: Router configuration

The data property in the third route is a place to store arbitrary data associated with this specific route. The data property is accessible within each activated route. Use it to store items such as page titles, breadcrumb text, and other read-only, static data. You'll use the resolve guard to retrieve dynamic data later in the guide.

Also this: Routes type

If you want to have data in the url, you can try this: https://angular.io/guide/router#heroes-list-optionally-selecting-a-hero

Answer 2

It's a bit clunky but you can use an UrlMatcher for setting arbitrary parameters. Like in this example:

const mainRoutes: Routes = [
  {
    // ...
    children: [
      {path: "", component: HomeComponent},
      {
        path: "/pageone",
        component: PageOneComponent,
        matcher: (url: UrlSegment[]) => ({
          consumed: url,
          posParams: {pageName: new UrlSegment('pageone', {pageName: 'pageone'})},
        }),
      }
    ]
    // ...
  }];