2016-07-08 2 views
4

я учусь Угловая 2. поэтому я хочу сделать несколько страниц HTML, чтобы сделать одно приложение страницу так я сделал. это. , но я получил проблему с маршрутизацией. он показывает мне ошибку, как этотИСКЛЮЧЕНИЕ: Ошибка: Uncaught (обещанию): Ошибка: Не удается найдено маршрутов: «»»

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 
]); 

и мои app.routes. ТР

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 { 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.component.ts является

import { Component } from '@angular/core'; 



@Component({ 
    selector: 'my-about', 
    templateUrl : 'app/about/about.html' 

}) 
export class AboutComponent { 
    abt = 'ABOUT '; 
} 

и about.html содержит

<h1>hello</h1> 

показывает пропе r, но при загрузке только localhost i.e app.component.ts он показывает указанную выше ошибку.

ответ

7

Издание это

При загрузке вам приложение URL является локальный: 3000 и, следовательно, вам необходимо указать путь, который по пути по умолчанию, который путь: «» и, следовательно, вы не обеспечивают этот путь эта ошибка идет.

Решение Добавьте ниже путь к файлу app.routes.ts

app.routes.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) 
]; 

И ваша проблема будет решена

+0

Я не в полной мере следовать что, но он удалил все мои ошибки. – Winnemucca

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