Question

我的朋友们。我非常努力，而且我没有得到那个麻烦的解决方案。

故障：当我在地址栏中写地址'localhost：2352 / home / index'时，我在标题中收到错误。但当我点击我的链接与相同的地址，这是完美的。

文件app.routing.ts。我使用的是ASP.NET Web Api，如果它很重要的话。

import { ModuleWithProviders } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';

import { HomeComponent } from './Components/home.component';
import { CartsComponent } from './Components/carts.component';

const appRoutes: Routes = [
    { path: '', component: HomeComponent, pathMatch: 'full' },
    { path: 'home/index', component: HomeComponent },
    { path: 'home/carts', component: CartsComponent },
    {
        path: 'home',
        children: [
            { path: '', component: HomeComponent },
            { path: 'index', component: HomeComponent },
            { path: 'carts', component: CartsComponent }            
        ]
    }
];

export const Routing: ModuleWithProviders = RouterModule.forRoot(appRoutes);

我在app.routing.ts中做了一些更改，在评论中建议的方式，但仍然无效。

文件app.routing.ts：

import { ModuleWithProviders } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';

import { HomeComponent } from './Components/home.component';
import { CartsComponent } from './Components/carts.component';

const appRoutes: Routes = [    
    {
        path: 'home',
        children: [
            { path: '', component: HomeComponent },
            { path: 'index', component: HomeComponent },
            { path: 'carts', component: CartsComponent }            
        ]
    },
    { path: '', component: HomeComponent, pathMatch: 'full' }
];

export const Routing: ModuleWithProviders = RouterModule.forRoot(appRoutes);

文件app.module.ts：

import { NgModule } from '@angular/core';
import { APP_BASE_HREF } from '@angular/common';
import { BrowserModule } from '@angular/platform-browser';
import { FormsModule, ReactiveFormsModule } from '@angular/forms';
import { HttpModule } from '@angular/http';
import { Routing } from './app.routing';
import { Ng2Bs3ModalModule } from 'ng2-bs3-modal/ng2-bs3-modal';

import { AppComponent } from './app.component';
import { HomeComponent } from './Components/home.component';
import { CartsComponent } from './Components/carts.component';

import { ProductService } from './Service/product.service'
import { CartService } from './Service/cart.service'

@NgModule({
    imports: [BrowserModule, FormsModule, ReactiveFormsModule, HttpModule, Routing, Ng2Bs3ModalModule],
    declarations: [AppComponent, HomeComponent, CartsComponent],
    providers: [{ provide: APP_BASE_HREF, useValue: '/' }, ProductService, CartService],
    bootstrap: [AppComponent]
})
export class AppModule { }

角度路由“无法匹配任何路由。网址段'主页/索引'。”

0 个答案: