角网格不敏感

时间:2018-02-21 11:49:13

标签: angular typescript angular-ui-router

我是棱角分明的新人。我有个问题。 localhost:4200 /产品正常工作但localhost:4200 /产品不能正常工作。我试试;

import { DefaultUrlSerializer, UrlTree } from '@angular/router';

    export class LowerCaseUrlSerializer extends DefaultUrlSerializer {
        parse(url: string): UrlTree {
        return super.parse(url.toLowerCase()); 
        }
    }
    .

    .

    .


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

但要使所有字母都小。我想要所有的链接工作。

/产物

/产品

/产品

/产物

...

app.module.ts

import { BrowserModule } from '@angular/platform-browser';
import { RouterModule, Route } from '@angular/router';
import { NgModule } from '@angular/core';
import { FormsModule } from '@angular/forms';
import { AppComponent } from './app.component';
import { ProductComponent } from './product/product.component';
import { HomeComponent } from './home/home.component';

const routeConfig: Route[] = [
{
  path: '',
  component: HomeComponent
},
{
  path: 'product',
  component:  ProductComponent
}
];

@NgModule({
  declarations: [
    AppComponent,
    ProductComponent,
    HomeComponent
],
  imports: [
    BrowserModule, FormsModule, RouterModule.forRoot(routeConfig)
  ],
  providers: [],

app.component.ts

import { Component } from '@angular/core';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent {
  title = 'Title';
}

我希望你理解。抱歉我的英语不好。

1 个答案:

答案 0 :(得分:0)

您应该添加此provide语句

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

app.module.ts文件。你在app模块中将提供者清空了。