2016-06-26 15 views
7

Per la cronologia: utilizza attualmente il nuovo "@angular/router": "3.0.0-alpha.8", le definizioni di percorso si trovano nella parte inferiore del post.Perché questa rotta non coincide con la navigazione diretta?

Quando si tenta di spostarsi nella mia applicazione il comportamento è diverso a seconda se io entro direttamente o seguendo un link all'URL:

  • Works: Entrando http://localhost:9292 nell'indirizzo-bar, correttamente in avanti per http://localhost:9292/about
  • Works: Navigare direttamente al http://localhost:9292/about attraverso l'indirizzo-bar
  • Works: Se si passa a http://localhost:9292/about/projects tramite un tag <a>, nel contesto dello FrontComponent e dell'attributo [routerLink]="['projects']", il routing funziona correttamente.
  • rotto: Direttamente navigazione verso http://localhost:9292/about/projects risultati il ​​seguente messaggio di errore (abbreviato Stacktrace):

    Unhandled Promise rejection: Cannot match any routes: 'projects' ; Zone: angular ; Task: Promise.then ; Value: Error: Cannot match any routes: 'projects' 
    Stack trace: 
    applyRedirects/<@http://localhost:9292/node_modules/@angular/router/apply_redirects.js:29:34 
    [email protected]://localhost:9292/node_modules/rxjs/Observable.js:52:57 
    

Cosa potrei fare male qui? C'è un modo per vedere tutti i percorsi che sono stati respinti nel messaggio di errore?

Modificare perché questo è stato suggerito numerose volte ora: non sospetto che si tratti di un problema lato server. Il routing precedente via router-deprecated funzionava bene e il HTML servito dal percorso in errore sembra perfetto. Ma solo nel caso in cui, questo è il server relativo codice di routing lato (ruby con sinatra):

# By now I have too often mistakenly attempted to load other assets than 
# HTML files from "user facing" URLs, mostly due to paths that should have 
# been absolute but weren't. This route attempts to catch all these 
# mistakes rather early, so that the show up as a nice 404 error in the 
# browsers debugging tools 
get /^\/(about|editor)\/.*\.(css|js)/ do 
    halt 404, "There are no assets in `editor` or `about` routes" 
end 

# Matching the meaningful routes the client knows. This enables navigation 
# even if the user submits a "deep link" to somewhere inside the 
# application. 
index_path = File.expand_path('index.html', settings.public_folder) 
get '/', '/about/?*', '/editor/*' do 
    send_file index_path 
end 

# Catchall for everything that goes wrong 
get '/*' do 
    halt 404, "Not found" 
end 

Io non sospetto che questo è dovuto al definizioni sbagliate percorso (routing funziona attraverso il link), ma per ragioni di completezza questi sono i percorsi:

anteriori/front.routes.ts:

export const FrontRoutes : RouterConfig = [ 
    { 
     path: '', 
     redirectTo: '/about', 
     terminal: true 
    }, 
    { 
     path : 'about', 
     component: FrontComponent, 
     children : [ 
      { path: 'projects', component: ProjectListComponent}, 
      { path: '',   component: AboutComponent}, 
     ] 
    } 
] 

editor/editor.routes.ts :

export const EditorRoutes : RouterConfig = [ 
    { 
     path: "editor/:projectId", 
     component : EditorComponent, 
     children : [ 
      { path: '', redirectTo: 'settings', terminal: true}, 
      { path: 'settings', component : SettingsComponent }, 
      { path: 'schema', component : SchemaComponent }, 
      { path: 'query/create', component : QueryCreateComponent }, 
      { path: 'query/:queryId', component : QueryEditorComponent }, 
      { path: 'page/:pageId', component : PageEditorComponent }, 
     ] 
    } 
] 

app.routes.ts:

import {EditorRoutes}     from './editor/editor.routes' 
import {FrontRoutes}     from './front/front.routes' 

export const routes : RouterConfig = [ 
    ...FrontRoutes, 
    ...EditorRoutes, 
] 

export const APP_ROUTER_PROVIDERS = [ 
    provideRouter(routes) 
] 
+0

Verificare che il codice lato server restituisca la pagina HTML corretta quando si accede a 'http: // localhost: 9292/about/projects' – AngJobs

+0

Quando si digita l'URL completo nella barra degli indirizzi, la richiesta passa prima al server e l'angolare viene eseguito in un secondo momento lato client, – AngJobs

+0

Se questo era il problema, la navigazione in 'http: // localhost: 9292/about' non dovrebbe funzionare, ma lo è. Mi sono occupato di questo sul server. –

risposta

6

Imposta "/" come valore al base tag del index.html per fare correttamente i percorsi di bambino router Resolve. Questo è not in line with the offical docs ma sembra funzionare.

+1

Perso due ore perché la documentazione è triste". " –