Angular 2 Route 3.0 Case-sensitive

Question

const routes: Routes = [ { path: 'x', component: xComponent }, { path: 'y', component: yComponent }, { path: 'zComponent', component: zComponent } ]; 

If I write in url x small, it will direct me to the component page, if I write X Capital, it will say an invalid url.

How to make a case insensitive case

Answer 1

Two options. 1. create 1 class URLSerializer

 import { DefaultUrlSerializer, UrlTree } from '@angular/router'; export class LowerCaseUrlSerializer extends DefaultUrlSerializer { parse(url: string): UrlTree { return super.parse(url.toLowerCase()); } } 

And in your app.module.ts

 providers: [ { provide: UrlSerializer, useClass: LowerCaseUrlSerializer } ], 

Option 2: A simple workaround in the route file.

 { path: '/home', redirectTo: ['/Home'] }, { path: '/Home', component: HomeComponent, name: 'Home' },