2016-10-25 9 views
2

Я использую Angular 2.1.0 в проекте Visual Studio 2015 AspNetCore и имею проблему с маршрутизацией в своих ленивых загружаемых модулях. Ошибка, как показано ниже:Невозможно сопоставить маршруты в Angular 2.1

core.umd.js:3257 EXCEPTION: Uncaught (in promise): Error: Cannot match any routes. URL Segment: 'Home/MyList' Error: Cannot match any routes. URL Segment: 'Home/MyList' at ApplyRedirects.noMatchError (http://localhost:31534/libraries/@angular/router/bundles/router.umd.js:769:20) at CatchSubscriber.eval [as selector] (http://localhost:31534/libraries/@angular/router/bundles/router.umd.js:747:33) at CatchSubscriber.error (http://localhost:31534/libraries/rxjs/operator/catch.js:52:31) at MapSubscriber.Subscriber._error (http://localhost:31534/libraries/rxjs/Subscriber.js:128:26) at MapSubscriber.Subscriber.error (http://localhost:31534/libraries/rxjs/Subscriber.js:102:18) at MapSubscriber.Subscriber._error (http://localhost:31534/libraries/rxjs/Subscriber.js:128:26) at MapSubscriber.Subscriber.error (http://localhost:31534/libraries/rxjs/Subscriber.js:102:18) at MapSubscriber.Subscriber._error (http://localhost:31534/libraries/rxjs/Subscriber.js:128:26) at MapSubscriber.Subscriber.error (http://localhost:31534/libraries/rxjs/Subscriber.js:102:18) at LastSubscriber.Subscriber._error (http://localhost:31534/libraries/rxjs/Subscriber.js:128:26)

я следовал Tour Of Heroes tutorial и адаптировать ее в соответствии с lazy load topic here Я загрузкой страницы входа первого {Home/Login} в бутстрапируемых модуле под названием AppModule. При нажатии на логин я хочу показать следующую страницу MyList, {Home/MyList}, которая лениво загружается в функциональный модуль под названием MyModule.

MyModule is based on the HeroModule from the second link above.

MyList страницы и связанной с компонентом является первая страница/компонент под MyModule который также имеет MyListDetail страницу/компонент {Home/MyListDetail}.

Я перейти к {Home/MyList} на кнопку мыши, используя этот код

let link = ['Home/MyList']; 
this.router.navigate(link); 

Почему мои маршруты не найдены? Вот как я их настраиваю.

приложение-routing.module.ts

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

export const routes: Routes = [ 
    { path: '', redirectTo: 'Home/Login', pathMatch: 'full'}, 
    { path: 'Home/MyList', loadChildren: 'scripts/My.Module#MyModule' } 

]; 

@NgModule({ 
    imports: [RouterModule.forRoot(routes)], 
    exports: [RouterModule] 
}) 
export class AppRoutingModule {} 

логин-routing.module.ts

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

import { LoginCmpnt } from './Login'; 

@NgModule({ 
    imports: [RouterModule.forChild([ 
    { path: 'Home/Login', component: LoginCmpnt} 
    ])], 
    exports: [RouterModule] 
}) 
export class LoginRoutingModule {} 

MyList-routing.module.ts

import { NgModule }   from '@angular/core'; 
import { Routes } from '@angular/router'; 
import { RouterModule }  from '@angular/router'; 
import { SharedModule } from './shared.module'; 
import { MyComponent } from './MyComponent'; 
import { MyListComponent } from './MyListComp'; 
import { MyListDetailComponent } from './MyListDetailComp'; 

const routes: Routes = [ 
    { path: '', 
    component: MyComponent, 
    children: [{ path: 'Home/MyList', component: MyListComponent }, 
     { path: 'Home/MyListDetail/:id', component: MyListDetailComponent }] 
    }]; 

@NgModule({ 
    imports: [RouterModule.forChild([routes]), SharedModule ], 
    exports: [RouterModule]}) 

export class MyListRoutingModule {} 

В MyList-routing.module выше, что я должен положить для пути против MyComponent? Метод Войти маршруты в Home/MyList

EDIT

Даже это с косой черты предшествующего пути в регистрационной мыши не работает.

let link = ['/Home/MyList']; 
this.router.navigate(link); 
+0

Вы пробовали 'let link = ['/ Home/MyList'];' (добавлено '/')? –

+0

Да. Это тоже не сработало. Мои маршруты не настроены с предыдущей косой чертой. Я попытался добавить косую черту в настройке, когда я добавил ее в код кнопки входа – user20358

+0

Вы не должны настраивать маршруты с помощью косой черты, но если вы не переходите к родному или дочернему маршруту, вы должны добавить ведущую косую черту при навигации по маршруту. –

ответ

-1

Ленивый загружен модуль больше всего будет так:

export class default MyModule{ 

} 

и app.routing вы больше всего использовать нагрузки по уходу за детьми.

+1

не работал для меня .. – user20358

Смежные вопросы