2016-07-13 23 views
6

Ho configurato Angular2 Router come di seguito:Angular2 Router Errore: Impossibile prodotto risultati in nessun percorsi: ''

import { provideRouter, RouterConfig } from '@angular/router'; 
import { Page2} from './page2'; 

const routes: RouterConfig = [ 
    { path: 'page2', component: Page2 } 
]; 

export const appRouterProviders = [ 
    provideRouter(routes) 
]; 

Plnkr disponibili here

Sulla L'esecuzione del codice ottengo l'errore:

Error: Cannot match any routes: '' 

Cosa mi manca qui?

+0

quale versione stai usando? angular2 rc2 o rc4? – ahkeno

+0

non so cosa sta importando plnkr – runtimeZero

risposta

2

È necessario definire router predefinito per '' come:

const routes: RouterConfig = [ 
    { path: '', component: Home }, 
    { path: 'page2', component: Page2 } 
]; 

O utilizzando reindirizzare:

const routes: RouterConfig = [ 
    { path: '', redirectTo: '/page2', pathMatch: 'full' }, 
    { path: 'page2', component: Page2 } 
]; 

Vedi anche l'esempio da angular2 documentazione

4

È necessario specificare un percorso per il caso in cui l'utente si trova alla pagina di indice della vostra applicazione, questa strada è la strada '' e dovrebbe assomigliare a questo: { path: '', component: MyComponent }

Se si desidera che la pagina predefinita essere page2 è necessario informare il percorso dell'indice per reindirizzare ad esso in questo modo:

{ path: 'page2', component: Page2 }, 
{ path: '', redirectTo: '/page2', pathMatch: 'full' } 

l'ordine qui è importante, il percorso più specifico dovrebbe venire prima.

0

a mia conoscenza, si desidera utilizzare come pagina predefinita della pagina app.ts e caricato pagina2 facendo clic su Page2?

Option1:risolvere rapidamente problema

Risolvendo il vostro errore console corrente è possibile aggiungere ai vostri app.route.ts

import { App} from './app'; 

const routes: RouterConfig = [ 
    { path: '', component: App, useAsDefault: true } 
    { path: 'page2', component: Page2 } 
]; 

e il risultato sarà

enter image description here

Ma vedrete che il vostro app.ts HTML caricherà due volte al caricamento! che non è un buon modo per risolvere!

Option2:

come io uso nel mio progetto, mi consiglia di creare nuova home page fare come pagina predefinita .Poi chiamare Pagina2 in app.ts

Ecco Plnkr http://plnkr.co/edit/vzl9lw

Soddisferebbe le tue esigenze!

Problemi correlati