Angular 2路由子问题

时间：2017-03-13 19:28:55

标签： angular angular-routing

我正在尝试在我的主组件上添加子路由但是当我点击路由器链接时我得到了这个例外

vendor.bundle.js:530 Angular is running in the development mode. Call    enableProdMode() to enable the production mode.
main.bundle.js:63 NgForm
error_handler.js:54 EXCEPTION: Uncaught (in promise): Error: Cannot   match any routes. URL Segment: 'home/teste'
Error: Cannot match any routes. URL Segment: 'home/teste'
   at ApplyRedirects.noMatchError   (http://localhost:4200/vendor.bundle.js:82905:16) [angular]
    at CatchSubscriber.selector (http://localhost:4200/vendor.bundle.js:82874:29) [angular]
    at CatchSubscriber.error (http://localhost:4200/vendor.bundle.js:66570:31) [angular]
    at MapSubscriber.Subscriber._error (http://localhost:4200/vendor.bundle.js:6330:26) [angular]
    at MapSubscriber.Subscriber.error (http://localhost:4200/vendor.bundle.js:6304:18) [angular]
    at MapSubscriber.Subscriber._error (http://localhost:4200/vendor.bundle.js:6330:26) [angular]
    at MapSubscriber.Subscriber.error (http://localhost:4200/vendor.bundle.js:6304:18) [angular]
    at MapSubscriber.Subscriber._error (http://localhost:4200/vendor.bundle.js:6330:26) [angular]
    at MapSubscriber.Subscriber.error (http://localhost:4200/vendor.bundle.js:6304:18) [angular]
    at LastSubscriber.Subscriber._error (http://localhost:4200/vendor.bundle.js:6330:26) [angular]
    at LastSubscriber.Subscriber.error (http://localhost:4200/vendor.bundle.js:6304:18) [angular]
    at MergeAllSubscriber.OuterSubscriber.notifyError (http://localhost:4200/vendor.bundle.js:47060:26) [angular]
    at InnerSubscriber._error (http://localhost:4200/vendor.bundle.js:86738:21) [angular]
    at InnerSubscriber.Subscriber.error (http://localhost:4200/vendor.bundle.js:6304:18) [angular]
 ErrorHandler.handleError @ error_handler.js:54
next @ application_ref.js:348
schedulerFn @ async.js:93
SafeSubscriber.__tryOrUnsub @ Subscriber.js:234
SafeSubscriber.next @ Subscriber.js:183
Subscriber._next @ Subscriber.js:125
Subscriber.next @ Subscriber.js:89
Subject.next @ Subject.js:55
EventEmitter.emit @ async.js:79
NgZone.triggerError @ ng_zone.js:333
onHandleError @ ng_zone.js:294
webpackJsonp.619.ZoneDelegate.handleError @ zone.js:334
webpackJsonp.619.Zone.runGuarded @ zone.js:142
_loop_1 @ zone.js:540
drainMicroTaskQueue @ zone.js:549
ZoneTask.invoke @ zone.js:420
error_handler.js:59 ORIGINAL STACKTRACE:
ErrorHandler.handleError @ error_handler.js:59
next @ application_ref.js:348
schedulerFn @ async.js:93
SafeSubscriber.__tryOrUnsub @ Subscriber.js:234
SafeSubscriber.next @ Subscriber.js:183
Subscriber._next @ Subscriber.js:125
Subscriber.next @ Subscriber.js:89
Subject.next @ Subject.js:55
EventEmitter.emit @ async.js:79
NgZone.triggerError @ ng_zone.js:333
onHandleError @ ng_zone.js:294
webpackJsonp.619.ZoneDelegate.handleError @ zone.js:334
webpackJsonp.619.Zone.runGuarded @ zone.js:142
_loop_1 @ zone.js:540
drainMicroTaskQueue @ zone.js:549
ZoneTask.invoke @ zone.js:420
error_handler.js:60 Error: Uncaught (in promise): Error: Cannot match      any routes. URL Segment: 'home/teste'
Error: Cannot match any routes. URL Segment: 'home/teste'
at ApplyRedirects.noMatchError (apply_redirects.js:149) [angular]
at CatchSubscriber.selector (apply_redirects.js:118) [angular]
at CatchSubscriber.error (catch.js:104) [angular]
at MapSubscriber.Subscriber._error (Subscriber.js:128) [angular]
at MapSubscriber.Subscriber.error (Subscriber.js:102) [angular]
at MapSubscriber.Subscriber._error (Subscriber.js:128) [angular]
at MapSubscriber.Subscriber.error (Subscriber.js:102) [angular]
at MapSubscriber.Subscriber._error (Subscriber.js:128) [angular]
at MapSubscriber.Subscriber.error (Subscriber.js:102) [angular]
at LastSubscriber.Subscriber._error (Subscriber.js:128) [angular]
at LastSubscriber.Subscriber.error (Subscriber.js:102) [angular]
at MergeAllSubscriber.OuterSubscriber.notifyError (OuterSubscriber.js:22) [angular]
at InnerSubscriber._error (InnerSubscriber.js:26) [angular]
at InnerSubscriber.Subscriber.error (Subscriber.js:102) [angular]
at resolvePromise (zone.js:643) [angular]
at resolvePromise (zone.js:619) [angular]
at polyfills.bundle.js:2957:17 [angular]
at Object.onInvokeTask (ng_zone.js:264) [angular]
at ZoneDelegate.webpackJsonp.619.ZoneDelegate.invokeTask (zone.js:362) [angular]
at Zone.webpackJsonp.619.Zone.runTask (zone.js:166) [<root> => angular]
at drainMicroTaskQueue (zone.js:529) [<root>]
at HTMLAnchorElement.ZoneTask.invoke (zone.js:420) [<root>]
ErrorHandler.handleError @ error_handler.js:60
next @ application_ref.js:348
schedulerFn @ async.js:93
SafeSubscriber.__tryOrUnsub @ Subscriber.js:234
SafeSubscriber.next @ Subscriber.js:183
Subscriber._next @ Subscriber.js:125
Subscriber.next @ Subscriber.js:89
Subject.next @ Subject.js:55
EventEmitter.emit @ async.js:79
NgZone.triggerError @ ng_zone.js:333 
onHandleError @ ng_zone.js:294
webpackJsonp.619.ZoneDelegate.handleError @ zone.js:334 
webpackJsonp.619.Zone.runGuarded @ zone.js:142
_loop_1 @ zone.js:540
drainMicroTaskQueue @ zone.js:549
ZoneTask.invoke @ zone.js:420
zone.js:516 Unhandled Promise rejection: Cannot match any routes. URL          Segment: 'home/teste' ; Zone: angular ; Task: Promise.then ; Value:       ZoneAwareError {__zone_symbol__error: Error: Cannot match any routes. URL     Segment: 'home/teste'
   at ApplyRedirects.noMatchError (http:/…, __zone_symbol__stack:       "Error: Cannot match any routes. URL Segment: 'home…   ocalhost:4200/vendor.bundle.js:6304:18) [angular]",    __zone_symbol__message: "Cannot match any routes. URL Segment:    'home/teste'"} Error: Cannot match any routes. URL Segment: 'home/teste'
    at ApplyRedirects.noMatchError (http://localhost:4200/vendor.bundle.js:82905:16) [angular]
    at CatchSubscriber.selector (http://localhost:4200/vendor.bundle.js:82874:29) [angular]
    at CatchSubscriber.error (http://localhost:4200/vendor.bundle.js:66570:31) [angular]
    at MapSubscriber.Subscriber._error (http://localhost:4200/vendor.bundle.js:6330:26) [angular]
    at MapSubscriber.Subscriber.error (http://localhost:4200/vendor.bundle.js:6304:18) [angular]
    at MapSubscriber.Subscriber._error (http://localhost:4200/vendor.bundle.js:6330:26) [angular]
    at MapSubscriber.Subscriber.error (http://localhost:4200/vendor.bundle.js:6304:18) [angular]
    at MapSubscriber.Subscriber._error  (http://localhost:4200/vendor.bundle.js:6330:26) [angular]
    at MapSubscriber.Subscriber.error (http://localhost:4200/vendor.bundle.js:6304:18) [angular]
    at LastSubscriber.Subscriber._error (http://localhost:4200/vendor.bundle.js:6330:26) [angular]
    at LastSubscriber.Subscriber.error (http://localhost:4200/vendor.bundle.js:6304:18) [angular]
    at MergeAllSubscriber.OuterSubscriber.notifyError (http://localhost:4200/vendor.bundle.js:47060:26) [angular]
    at InnerSubscriber._error (http://localhost:4200/vendor.bundle.js:86738:21) [angular]
    at InnerSubscriber.Subscriber.error (http://localhost:4200/vendor.bundle.js:6304:18) [angular]
 consoleError @ zone.js:516
_loop_1 @ zone.js:545
 drainMicroTaskQueue @ zone.js:549
 ZoneTask.invoke @ zone.js:420
 zone.js:518 ZoneAwareError {__zone_symbol__error: Error: Uncaught (in   promise): Error: Cannot match any routes. URL Segment: 'home/teste'
Error: Canno…, rejection: ZoneAwareError, promise: ZoneAwarePromise,   zone: Zone, task: ZoneTask…}
consoleError @ zone.js:518
_loop_1 @ zone.js:545
drainMicroTaskQueue @ zone.js:549
ZoneTask.invoke @ zone.js:420

我的家庭模块

import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { HOME_ROUTING } from './home.routing';
import { HomeComponent } from './home.component';
import { MenuComponent } from '../menu/menu.component';
import { TesteComponent } from '../teste/teste.component';

@NgModule({
  imports: [
   CommonModule,
   HOME_ROUTING
  ],
  declarations: [
    HomeComponent,
    MenuComponent,
    TesteComponent,
  ],
  providers: [] 
})
export class HomeModule {}

我的家庭路线

import { ModuleWithProviders } from '@angular/core';
import { RouterModule, Routes } from '@angular/router';
import { TesteComponent } from '../teste/teste.component';
import { HomeComponent } from './home.component';

const HOME_ROUTES: Routes = [
  {
    path: 'home',
    children: [
      { path: '', component: HomeComponent },
      { path: 'teste', component: TesteComponent, outlet:'homeRouterOutlet' },
   ]
 }
];

export const HOME_ROUTING: ModuleWithProviders = RouterModule.forChild(HOME_ROUTES);

我的路由器链接

<li><a [routerLink]="['teste']">Crear</a>

我的app.routing 

import { Routes, RouterModule } from '@angular/router';
import { LoginComponent } from './login/login.component';
import { HomeComponent } from './home/home.component';

const ROUTES : Routes = [
  { path: 'login', component: LoginComponent },
  { path: 'home', component: HomeComponent },

  // otherwise redirect to home
  { path: '', redirectTo: '/login', pathMatch: 'full' }
];

export const ROUTING = RouterModule.forRoot(ROUTES);

当我点击我的链接时发生此异常，我不知道为什么。我已经为它搜索了一些解决方案，但没有成功，我希望有人可以帮助我。

0 个答案:

没有答案
相关问题
最新问题