2015-12-20 19 views
11

Eşdeğeri Uygulamam için Angular 2 yönlendirme kullanıyorum ve gayet iyi çalışıyor ancak "aksi halde" rotayı nasıl tanımlayacağımı bilmiyorum. Bu nedenle, eğer mevcut URL, herhangi bir "desteklenen" rotaya karşılık gelmiyorsa, görüntülenecek bir rota.Açısal 1 eşdeğeri Aksi durumda 2

@RouteConfig([ 
    { path: '/', name: 'Home', component: StoryComponent, useAsDefault: true }, 
    { path: '/story', name: 'Story', component: StoryComponent }, 
    { path: '/subscription', name: 'Subscription', component: SubscriptionComponent} 
]) 
+3

, kontrol [# 2965] (https://github.com/angular/angular/issues/2965) ve [# 4055] (https://github.com/angular/angular/issues/4055) –

+0

Tamam, teşekkürler. – ssougnez

+0

Bu neden 'useAsDefault' değerine sahip değil misiniz? – jornare

cevap

8

açısal 2'de hayır 'aksi' rota henüz yok: İşte

benim geçerli yapılandırma örneğidir. Ancak aynı işlevselliği yüzden gibi joker parametresi kullanılarak elde edilebilir: Bu sadece 'NOTFOUND' bileşeni yükleyecektir ve URL Gittiğiniz neyi aynı olacaktır

@RouteConfig([ 
    { path: '/', redirectTo: ['Home'] }, 
    { path: '/home', name: 'Home', component: HomeComponent }, 
    // all other routes and finally at the last add 
    {path: '/*path', component: NotFound} 

. Bunu deneyin yerine aksi

//at the end of the route definitions 
{ path: '/404', name: '404', component: PageNotFoundComponent }, 
{ path: '/*path', redirectTo:['404'] }` 
+0

Bir alt rotata yönlendiriyorsanız, yönlendirme çalışmaz. Sadece 'NotFound' bileşenini kullanıp Router'ı enjekte etmenizi öneririm, böylece kurucunun içinde yeniden yönlendirebilirsiniz. – gerric

3

: Eğer bütün bir '404' url yönlendirme için yolları uymayan istediğiniz, sizin gibi bir şey yapabilirsiniz. Benim için çalışıyor, emin değil ama devam eden çalışma gibi görünüyor.

@RouteConfig([ 
    { path: '/**', redirectTo: ['MycmpnameCmp'] }, 
    ... 
    } 
]) 

https://github.com/angular/angular/issues/4055

7

Bu, şu anda açısal 2'de mevcut en iyi çözüm uygulanmadı @Gary gösterdi gibi bir çözelti kullanmaktır. açılı kılavuz yönlendirme bölümünde (https://angular.io/docs/ts/latest/guide/router.html) 'de gösterildiği gibi

{ path: '**', component: PageNotFoundComponent }

.

0

bu

RouterModule.forRoot([ 
    { path: 'login', component: LoginComponent }, 
    { path: 'edit-event', component: EventComponent }, 
    { path: 'participants', component: ParticipantsComponent }, 
    { path: 'notification', component: NotificationComponent }, 
    { path: '', component: WelcomeComponent }, //default 
    { path: '**', component: WelcomeComponent } //page not found route 
], { useHash: true }) 

useHash parametresini deneyin Bu benim için çalıştı https://angular.io/docs/ts/latest/guide/router.html#!#route-config

1

karma url stilini kullanarak içindir: Bu özellik henüz uygulanmadı

const routes: Routes = [ 
    { path: '', redirectTo: '/home', pathMatch: 'full' }, 
    { path: 'home', component: HomeComponent }, 
    // all other routes 
    { path: '**', redirectTo: '/home' } 
]; 

@NgModule({ 
    imports: [RouterModule.forRoot(routes)], 
    exports: [RouterModule] 
}) 
export class AppRoutingModule { }