Javascript 异常:错误:未捕获(承诺中):错误:无法匹配任何路由:''&引用;
我正在学英语。 因此,我想呈现多个html页面,以制作单页应用程序。 所以我成功了。 但我在路由上遇到了问题。 它向我展示了这样的错误Javascript 异常:错误:未捕获(承诺中):错误:无法匹配任何路由:''&引用;,javascript,angularjs,typescript,Javascript,Angularjs,Typescript,我正在学英语。 因此,我想呈现多个html页面,以制作单页应用程序。 所以我成功了。 但我在路由上遇到了问题。 它向我展示了这样的错误 EXCEPTION: Error: Uncaught (in promise): Error: Cannot match any routes: '' platform-browser.umd.js:1900 EXCEPTION: Error: Uncaught (in promise): Error: Cannot match any routes: ''B
EXCEPTION: Error: Uncaught (in promise): Error: Cannot match any routes: ''
platform-browser.umd.js:1900 EXCEPTION: Error: Uncaught (in promise): Error: Cannot match any routes: ''BrowserDomAdapter.logError @ platform-browser.umd.js:1900BrowserDomAdapter.logGroup @ platform-browser.umd.js:1910ExceptionHandler.call @ core.umd.js:4329(anonymous function) @ core.umd.js:9813schedulerFn @ core.umd.js:6699SafeSubscriber.__tryOrUnsub @ Subscriber.ts:240SafeSubscriber.next @ Subscriber.ts:192Subscriber._next @ Subscriber.ts:133Subscriber.next @ Subscriber.ts:93Subject._finalNext @ Subject.ts:154Subject._next @ Subject.ts:144Subject.next @ Subject.ts:90EventEmitter.emit @ core.umd.js:6687NgZone._zoneImpl.NgZoneImpl.onError @ core.umd.js:9249NgZoneImpl.inner.inner.fork.onHandleError @ core.umd.js:9121ZoneDelegate.handleError @ zone.js:327Zone.runGuarded @ zone.js:233_loop_1 @ zone.js:487drainMicroTaskQueue @ zone.js:494ZoneTask.invoke @ zone.js:426
platform-browser.umd.js:1900 STACKTRACE:BrowserDomAdapter.logError @ platform-browser.umd.js:1900ExceptionHandler.call @ core.umd.js:4331(anonymous function) @ core.umd.js:9813schedulerFn @ core.umd.js:6699SafeSubscriber.__tryOrUnsub @ Subscriber.ts:240SafeSubscriber.next @ Subscriber.ts:192Subscriber._next @ Subscriber.ts:133Subscriber.next @ Subscriber.ts:93Subject._finalNext @ Subject.ts:154Subject._next @ Subject.ts:144Subject.next @ Subject.ts:90EventEmitter.emit @ core.umd.js:6687NgZone._zoneImpl.NgZoneImpl.onError @ core.umd.js:9249NgZoneImpl.inner.inner.fork.onHandleError @ core.umd.js:9121ZoneDelegate.handleError @ zone.js:327Zone.runGuarded @ zone.js:233_loop_1 @ zone.js:487drainMicroTaskQueue @ zone.js:494ZoneTask.invoke @ zone.js:426
platform-browser.umd.js:1900 Error: Uncaught (in promise): Error: Cannot match any routes: ''
at resolvePromise (zone.js:538)
at zone.js:515
at ZoneDelegate.invoke (zone.js:323)
at Object.NgZoneImpl.inner.inner.fork.onInvoke (core.umd.js:9100)
at ZoneDelegate.invoke (zone.js:322)
at Zone.run (zone.js:216)
at zone.js:571
at ZoneDelegate.invokeTask (zone.js:356)
at Object.NgZoneImpl.inner.inner.fork.onInvokeTask (core.umd.js:9091)
at ZoneDelegate.invokeTask (zone.js:355)BrowserDomAdapter.logError @ platform-browser.umd.js:1900ExceptionHandler.call @ core.umd.js:4332(anonymous function) @ core.umd.js:9813schedulerFn @ core.umd.js:6699SafeSubscriber.__tryOrUnsub @ Subscriber.ts:240SafeSubscriber.next @ Subscriber.ts:192Subscriber._next @ Subscriber.ts:133Subscriber.next @ Subscriber.ts:93Subject._finalNext @ Subject.ts:154Subject._next @ Subject.ts:144Subject.next @ Subject.ts:90EventEmitter.emit @ core.umd.js:6687NgZone._zoneImpl.NgZoneImpl.onError @ core.umd.js:9249NgZoneImpl.inner.inner.fork.onHandleError @ core.umd.js:9121ZoneDelegate.handleError @ zone.js:327Zone.runGuarded @ zone.js:233_loop_1 @ zone.js:487drainMicroTaskQueue @ zone.js:494ZoneTask.invoke @ zone.js:426
zone.js:461 Unhandled Promise rejection: Cannot match any routes: '' ; Zone: angular ; Task: Promise.then ; Value: Error: Cannot match any routes: ''(…)consoleError @ zone.js:461_loop_1 @ zone.js:490drainMicroTaskQueue @ zone.js:494ZoneTask.invoke @ zone.js:426
zone.js:463 Error: Uncaught (in promise): Error: Cannot match any routes: ''(…)consoleError @ zone.js:463_loop_1 @ zone.js:490drainMicroTaskQueue @ zone.js:494ZoneTask.invoke @ zone.js:426
main.ts文件是
import { bootstrap } from '@angular/platform-browser-dynamic';
import { AppComponent } from './app.component';
import { APP_ROUTER_PROVIDERS } from './app.routes';
bootstrap(AppComponent, [
APP_ROUTER_PROVIDERS
]);
import { Component } from '@angular/core';
import { AboutComponent } from './about/about.component';
import { ROUTER_DIRECTIVES } from '@angular/router';
@Component({
selector: 'my-app',
template: `
<h1> this is our app.component.ts</h1>
<h2>{{title}}</h2>
<a [routerLink]="['/about']">ABOUT ADSELINT</a>
<router-outlet></router-outlet>
`,
directives: [ROUTER_DIRECTIVES]
})
export class AppComponent {
title = 'app.component';
}
我的app.routes.ts是
import { provideRouter, RouterConfig } from '@angular/router';
import { AboutComponent } from './about/about.component';
export const routes: RouterConfig = [
{
path : 'about',
component : AboutComponent
}
];
export const APP_ROUTER_PROVIDERS = [
provideRouter(routes)
];
我的app.component.ts文件是
import { bootstrap } from '@angular/platform-browser-dynamic';
import { AppComponent } from './app.component';
import { APP_ROUTER_PROVIDERS } from './app.routes';
bootstrap(AppComponent, [
APP_ROUTER_PROVIDERS
]);
import { Component } from '@angular/core';
import { AboutComponent } from './about/about.component';
import { ROUTER_DIRECTIVES } from '@angular/router';
@Component({
selector: 'my-app',
template: `
<h1> this is our app.component.ts</h1>
<h2>{{title}}</h2>
<a [routerLink]="['/about']">ABOUT ADSELINT</a>
<router-outlet></router-outlet>
`,
directives: [ROUTER_DIRECTIVES]
})
export class AppComponent {
title = 'app.component';
}
及
about.html包含
<h1>hello</h1>
你好
它显示正确的输出,但在仅加载localhost(即app.component.ts)时,它会显示上述错误 问题是什么
当您加载应用程序时,URL为localhost:3000,因此您需要提供一个默认路径,即路径:',因此您不提供此路径。此错误即将发生
解决方案
将以下路径添加到app.routes.ts文件应用程序路由.ts
import { provideRouter, RouterConfig } from '@angular/router';
import { AboutComponent } from './about/about.component';
import {AppComponent} from './app.component';
export const routes: RouterConfig = [
{
path: '',
redirectTo: '/about',
pathMatch: 'full'
},
{
path : 'about',
component : AboutComponent
}
];
export const APP_ROUTER_PROVIDERS = [
provideRouter(routes)
];
你的问题会解决的我不完全明白这一点,但它确实消除了我所有的错误。