Angular 2 Empty Component Routing

我是Angular 2的新手，我有一個關於路由的問題。我有一個app.routing文件，其中我只想要一個路徑。Angular 2 Empty Component Routing

{path: 'signup', component: SignupComponent}

但是，如果我運行此代碼我得到一個錯誤：

Error: Uncaught (in promise): Error: Cannot match any routes: ''

所以我決定'的路徑，其中的工作原理完全一樣我想上只使用一個空組件。

路由文件：

import {Routes, RouterModule} from '@angular/router'; 
import {SignupComponent} from "./signup/signup.component"; 
import {EmptyComponent} from "./empty/empty.component"; 

const appRoutes:Routes = [ 
    {path: '', component: EmptyComponent}, 
    {path: 'signup', component: SignupComponent} 
]; 

export const appRoutingProviders = []; 

export const routing = RouterModule.forRoot(appRoutes);

與路由器出口文件：

<header> 
    <div class="btn-wrapper"> 
     <button class="btn-sign-up btn-fancy" routerLink="/signup">Sign Up</button> 
     <button class="btn-sign-in btn-ghost btn-fancy">Sign In</button> 
    </div> 
    <i class="material-icons more">keyboard_arrow_down</i> 
    <router-outlet></router-outlet> 
    <div class="overlay" *ngIf="overlay" (click)="close()"></div> 
    <div class="tinted"></div> 
</header>

我只想路由器只路由「註冊」路徑上的SignupComponent。有沒有另外一種方法來做到這一點，並消除使用空的組件？如果這個問題寫得不好，我很抱歉，我對StackOverflow非常陌生。

來源

2016-09-24 M. Ung

只是讓你空航線重定向到註冊路線：

const appRoutes:Routes = [ 
    {path: '', redirectTo: 'signup', pathMatch: 'full'}, 
    {path: 'signup', component: SignupComponent} 
];

或者，如果你想，直到你導航到signup路由器的出口是空的，離開四個完全空：

const appRoutes:Routes = [ 
    {path: '', children: []}, 
    {path: 'signup', component: SignupComponent} 
];

來源

2016-09-24 21:22:57 nickspoon

感謝您的回答！但我不希望任何東西在路徑上路由「。 SignupComponent應該只顯示在'註冊'上。 –

再次感謝，但現在我得到這個錯誤：無效的路由配置''：必須提供以下之一（組件或redirectTo或兒童或loadChildren） –

哦，真的嗎？這對以前的測試版起作用，但可能它不再工作，對不起。你使用哪個版本的角？ 2.0.0最終？ – nickspoon

import { ModuleWithProviders } from '@angular/core'; 
import { Routes, RouterModule } from '@angular/router'; 

import { DemoComponent } from './demo.component'; 

const demoRoutes: Routes = [ 
    { path: '', component: DemoComponent } 
]; 

export const demoRouting: ModuleWithProviders = RouterModule.forChild(demoRoutes);

來源

2017-06-07 13:50:30 scr

Angular 2 Empty Component Routing

回答

相關問題