2016-07-02 4 views
3

私は"@angular/router": "3.0.0-beta.2"でangular2 rc4アプリケーションを書いています。すべての無効なURLをangular2 rc4で特定のコンポーネントにリダイレクト

私は2つのルート、歓迎と助けを持っています。私は歓迎コンポーネントに他のすべてをリダイレクトする別のルートを作成しました。

import { provideRouter, RouterConfig } from "@angular/router"; 
import {WelcomeComponent} from "./welcome.component"; 
import {HelpComponent} from "./help.component"; 

export const routes:RouterConfig = [ 
    { path: "",redirectTo: "welcome"}, 
    { path: "welcome", component: WelcomeComponent }, 
    { path: "help",component: HelpComponent} 
]; 

export const APP_ROUTER_PROVIDERS = [ 
    provideRouter(routes) 
]; 

私のサーバーがGoLangであり、私はそれがすべて無効なURLが今私は、例えば参照する場合

をindex.htmlにするためにリダイレクトすることを設定している:

これは私のroutes.tsファイルです。 localhost/weclome2、それがない は私のコンテンツ歓迎コンポーネントを示しているが、ブラウザ上のuRLはまだinstead歓迎のwelcome2を指すと私はまた、JavaScriptコンソールに次のエラーを取得:

EXCEPTION: Error: Uncaught (in promise): Error: Cannot match any routes: 'welcome2' 
VM8530:27 EXCEPTION: Error: Uncaught (in promise): Error: Cannot match any routes: 'welcome2'window.console.error @ VM8530:27BrowserDomAdapter.logError @ bundle.js:50349BrowserDomAdapter.logGroup @ bundle.js:50359ExceptionHandler.call @ bundle.js:11343(anonymous function) @ bundle.js:14458schedulerFn @ bundle.js:14747SafeSubscriber.__tryOrUnsub @ bundle.js:15377SafeSubscriber.next @ bundle.js:15326Subscriber._next @ bundle.js:15279Subscriber.next @ bundle.js:15243Subject.next @ bundle.js:14835EventEmitter.emit @ bundle.js:14735onError @ bundle.js:19058onHandleError @ bundle.js:19270ZoneDelegate.handleError @ bundle.js:5267Zone.runGuarded @ bundle.js:5173_loop_1 @ bundle.js:5427drainMicroTaskQueue @ bundle.js:5434ZoneTask.invoke @ bundle.js:5366 
VM8530:27 STACKTRACE:window.console.error @ VM8530:27BrowserDomAdapter.logError @ bundle.js:50349ExceptionHandler.call @ bundle.js:11345(anonymous function) @ bundle.js:14458schedulerFn @ bundle.js:14747SafeSubscriber.__tryOrUnsub @ bundle.js:15377SafeSubscriber.next @ bundle.js:15326Subscriber._next @ bundle.js:15279Subscriber.next @ bundle.js:15243Subject.next @ bundle.js:14835EventEmitter.emit @ bundle.js:14735onError @ bundle.js:19058onHandleError @ bundle.js:19270ZoneDelegate.handleError @ bundle.js:5267Zone.runGuarded @ bundle.js:5173_loop_1 @ bundle.js:5427drainMicroTaskQueue @ bundle.js:5434ZoneTask.invoke @ bundle.js:5366 
VM8530:27 Error: Uncaught (in promise): Error: Cannot match any routes: 'welcome2' 
at resolvePromise (bundle.js:5478) 
at bundle.js:5455 
at ZoneDelegate.invoke (bundle.js:5263) 
at Object.onInvoke (bundle.js:19249) 
at ZoneDelegate.invoke (bundle.js:5262) 
at Zone.run (bundle.js:5156) 
at bundle.js:5511 
at ZoneDelegate.invokeTask (bundle.js:5296) 
at Object.onInvokeTask (bundle.js:19240) 
at ZoneDelegate.invokeTask (bundle.js:5295)window.console.error @ VM8530:27BrowserDomAdapter.logError @ bundle.js:50349ExceptionHandler.call @ bundle.js:11346(anonymous function) @ bundle.js:14458schedulerFn @ bundle.js:14747SafeSubscriber.__tryOrUnsub @ bundle.js:15377SafeSubscriber.next @ bundle.js:15326Subscriber._next @ bundle.js:15279Subscriber.next @ bundle.js:15243Subject.next @ bundle.js:14835EventEmitter.emit @ bundle.js:14735onError @ bundle.js:19058onHandleError @ bundle.js:19270ZoneDelegate.handleError @ bundle.js:5267Zone.runGuarded @ bundle.js:5173_loop_1 @ bundle.js:5427drainMicroTaskQueue @ bundle.js:5434ZoneTask.invoke @ bundle.js:5366 
VM8530:27 Unhandled Promise rejection: Cannot match any routes: 'welcome2' ; Zone: angular ; Task: Promise.then ; Value: Error: Cannot match any routes: 'welcome2'(…)window.console.error @ VM8530:27consoleError @ bundle.js:5401_loop_1 @ bundle.js:5430drainMicroTaskQueue @ bundle.js:5434ZoneTask.invoke @ bundle.js:5366 
VM8530:27 Error: Uncaught (in promise): Error: Cannot match any routes: 'welcome2'(…)window.console.error @ VM8530:27consoleError @ bundle.js:5403_loop_1 @ bundle.js:5430drainMicroTaskQueue @ bundle.js:5434ZoneTask.invoke @ bundle.js:5366 

私は何が欠けていますか?

ありがとうございました!

更新

は、Google検索によると、私はangular2の古いバージョンにいくつかの回答を見つけたので、私は次のコードで新しいバージョンにそれらを採用しようとした:

export const routes:RouterConfig = [ 
    { path: "",redirectTo:"welcome",pathMatch:"full"}, 
    { path: "welcome", component: WelcomeComponent }, 
    { path: "help",component: HelpComponent}, 
    { path: "*",redirectTo:"welcome"} 
]; 

が、結果はありますまったく同じ。

答えて

9

'*' シングル

export const routes:RouterConfig = [ 
    { path: "",redirectTo:"welcome",pathMatch:"full"}, 
    { path: "welcome", component: WelcomeComponent }, 
    { path: "help",component: HelpComponent}, 
    { path: "**",redirectTo:"welcome"} 
]; 
とは対照的に、新しいルータは '**' 使用しています
関連する問題