混合AngularJS和Angular 2路由時的通配符路徑

Question

我不知道如何在從AngularJS升級到ng2的應用中執行通配符路徑路由。

一般來說，混合的路由這樣的兩種：

的第一步具有雙重路由器的設置是添加包含每個路由器一個出口的角根 組件。 AngularJS將使用ng-view的 ，而Angular將使用router-outlet。當用戶使用它的 路由器時，另一個插座將是空的。

import { Component } from '@angular/core'; 
@Component({ 
    selector: 'my-app', 
    template: ` 
    <router-outlet></router-outlet> 
    <div ng-view></div> 
    `, 
}) 
export class AppComponent { } 

https://angular.io/docs/ts/latest/guide/upgrade.html#!#dividing-routes-between-angular-and-angularjs

在角2可以指定這樣一個通配符路徑：

{路徑： '**'，組分：PageNotFoundComponent}

在AngularJS可以有這樣的通配符路徑：

$routeProvider 
    .otherwise({ 
    template: '<page-not-found></page-not-found>', 
    }); 

當我把所有東西放在一起並且路徑沒有處理時，如何避免兩臺路由器發出<page-not-found>？

Answer 1

如果其他設置正確，我可以確認<div ng-view></div>在角度2 AppComponent組件中工作。 （添加AppComponent至AppModule的bootstrap陣列）。

使用HybridUrlHandlingStrategy可防止Angular在請求ng1路由時拋出錯誤。

添加虛擬路由與空（「」）的模板，以防止NG1從呈現404頁時，被請求的頁面NG2：

$routeProvider 
    .when('/some/ng1/path', {template: '<something></something>'}) 
    .when('/some/ng2/path', {template: ''}) // ng2 route 
    .otherwise({template: '<page-not-found></page-not-found>'});