無法匹配任何路由。 URL段

我有以下的設備組件鏈接，我希望它的路線由我來指揮設備組件無法匹配任何路由。 URL段

<a [routerLink]="['/devicescommands',device.Id]" class="col-1-4" data-toggle="tooltip" data-placement="top" title="کد های بازگشت"> 
          <span class="glyphicon glyphicon-book" aria-hidden="true"></span> 
         </a>

，這是我的路由模塊：

import { NgModule } from '@angular/core'; 
import { RouterModule, Routes } from '@angular/router'; 

import { DeviceComponent } from './device/device.component'; 
import { CommandComponent } from './device/command/command.component'; 
import { DeviceConfigurationComponent } from './device/configuration/device- 
configuration.component'; 
import { ModulesComponent } from './modules/modules.component'; 
import { ModuleConfigurationComponent } from 
'./modules/configuration/module-configuration.component'; 

const routes: Routes = [ 
{ path: '', redirectTo: '/modules' }, 

{ path: 'modules', component: ModulesComponent }, 
{ path: 'moduleconfiguration/:id', component: ModuleConfigurationComponent 
}, 

{ path: 'devices', component: DeviceComponent}, 
{ path: 'devicescommands/:id', component: CommandComponent }, 
{ path: 'deviceconfiguration/:id', component: DeviceConfigurationComponent } 
]; 

@NgModule({ 
imports: [ 
    RouterModule.forRoot(
     routes, 
     { enableTracing: true } 
    ) 
], 
exports: [RouterModule]

}）出口類AppRoutingModule {}

，這是應用模塊：

import { NgModule, APP_INITIALIZER } from '@angular/core'; 
import { BrowserModule } from '@angular/platform-browser'; 
import { ReactiveFormsModule } from '@angular/forms'; 
import { FormsModule } from '@angular/forms'; 
import { HttpModule } from '@angular/http'; 
import { HashLocationStrategy, LocationStrategy } from '@angular/common'; 

import { AppRoutingModule } from './app-routing.module'; 
import { CatalogServerService } from './share/catalog-server-service/catalog-server-service' 
import { StatusPipe } from './share/pipes/status.pipe'; 
import { ProfileConfigPipe } from './share/pipes/profile-config.pipe'; 
import { PersianDatePipe } from './share/pipes/persian-date.pipe'; 
import { SuccessFaildPipe } from './share/pipes/success-faild.pipe'; 

import { AppComponent } from './app.component'; 
import { DeviceComponent } from './device/device.component'; 
import { DeviceService } from './device/services/device.service'; 
import { DeviceConfigurationComponent } from './device/configuration/device- 
configuration.component'; 
import { CommandComponent } from './device/command/command.component'; 

import { ModulesComponent } from './modules/modules.component'; 
import { ModulesService } from './modules/services/modules.service'; 
import { ModuleConfigurationComponent } from 
'./modules/configuration/module-configuration.component'; 

import { DynamicFormComponent } from './share/dynamic-from/dynamic- 
form.component'; 
import { DynamicFormControlComponent } from './share/dynamic-from/dynamic- 
form-control.component'; 

import { SignalRService } from './share/services/signalr-r-service'; 

@NgModule({ 
imports: [ 
    BrowserModule, 
    FormsModule, 
    HttpModule, 
    ReactiveFormsModule, 
    AppRoutingModule 
], 
declarations: [ 
    DeviceComponent, 
    DeviceConfigurationComponent, 
    CommandComponent, 
    ModulesComponent, 
    ModuleConfigurationComponent, 
    StatusPipe, 
    PersianDatePipe, 
    ProfileConfigPipe, 
    SuccessFaildPipe, 
    DynamicFormComponent, 
    DynamicFormControlComponent, 
    AppComponent, 
], 
providers: [ 
    CatalogServerService, 
    { 
     provide: APP_INITIALIZER, 
     useFactory: (configService: CatalogServerService) => { return() => configService.loadConfig(); }, 
     deps: [CatalogServerService], 
     multi: true 
    }, 
    ModulesService, 
    DeviceService, 
    SignalRService, 
    { provide: LocationStrategy, useClass: HashLocationStrategy } 
], 
bootstrap: [AppComponent] 
}) 
export class AppModule { }

當我點擊鏈接devicescommands我希望它CommandComponent路線，但我在控制檯收到此錯誤：

errors.ts:42 ERROR Error: Uncaught (in promise): Error: Cannot match any routes. URL Segment: 'devicescommands/96c1f24d-6673-4df0-9704-e44842821605' 
Error: Cannot match any routes. URL Segment: 'devicescommands/96c1f24d-6673-4df0-9704-e44842821605' 
    at ApplyRedirects.noMatchError (apply_redirects.ts:160) 
    at CatchSubscriber.eval [as selector] (apply_redirects.ts:142) 
    at CatchSubscriber.error (catch.ts:55) 
    at MapSubscriber.Subscriber._error (Subscriber.ts:139) 
    at MapSubscriber.Subscriber.error (Subscriber.ts:109) 
    at MapSubscriber.Subscriber._error (Subscriber.ts:139) 
    at MapSubscriber.Subscriber.error (Subscriber.ts:109) 
    at MapSubscriber.Subscriber._error (Subscriber.ts:139) 
    at MapSubscriber.Subscriber.error (Subscriber.ts:109) 
    at LastSubscriber.Subscriber._error (Subscriber.ts:139) 
    at ApplyRedirects.noMatchError (apply_redirects.ts:160) 
    at CatchSubscriber.eval [as selector] (apply_redirects.ts:142) 
    at CatchSubscriber.error (catch.ts:55) 
    at MapSubscriber.Subscriber._error (Subscriber.ts:139) 
    at MapSubscriber.Subscriber.error (Subscriber.ts:109) 
    at MapSubscriber.Subscriber._error (Subscriber.ts:139) 
    at MapSubscriber.Subscriber.error (Subscriber.ts:109) 
    at MapSubscriber.Subscriber._error (Subscriber.ts:139) 
    at MapSubscriber.Subscriber.error (Subscriber.ts:109) 
    at LastSubscriber.Subscriber._error (Subscriber.ts:139) 
    at resolvePromise (zone.js:769) 
    at resolvePromise (zone.js:740) 
    at zone.js:817 
    at ZoneDelegate.invokeTask (zone.js:424) 
    at Object.onInvokeTask (ng_zone.ts:253) 
    at ZoneDelegate.invokeTask (zone.js:423) 
    at Zone.runTask (zone.js:191) 
    at drainMicroTaskQueue (zone.js:584) 
    at HTMLAnchorElement.ZoneTask.invoke (zone.js:490)

devicescommands鏈路處於DeviceComponent。

來源

2017-09-27 danialtehrani

嘗試刪除'/'在'routerLink' – bhanu

沒有它不工作。我在設備組件另一個鏈接：它的工作原理。但命令設備鏈接不起作用 – danialtehrani

爲什麼要爲路由創建一個單獨的模塊？我不明白需要。您應該創建一些功能模塊並將其導入到您的應用程序模塊中。按照 https://stackoverflow.com/questions/40834840/angular-2-feature-module-routing-example –

我相信你的devices路徑會干擾你的devicescommands路徑，因爲兩者都以'設備'開頭。如果你切換兩個這樣的順序：

{ path: 'devicescommands/:id', component: CommandComponent }, 
{ path: 'devices', component: DeviceComponent},

那麼它應該工作。

來源

2017-09-27 07:00:43

運氣好嗎？我很好奇聽到這是否是這個問題。 –

無法匹配任何路由。 URL段

回答

相關問題