Question

我不知道如何在从AngularJS升级到ng2的应用程序中进行通配符路径路由。

通常，您可以混合使用这两种路由：

设置双路由器的第一步是添加Angular根每个路由器包含一个插座的组件。 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

在Angular 2中，您可以指定通配符路径，如下所示：

{path：'**'，component：PageNotFoundComponent}

在AngularJS中，您可以使用如下通配符路径：

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

当我将所有内容放在一起并且未处理路径时，如何避免两个路由器都发出<page-not-found>？

Answer 1

如果其他所有内容都设置正确，我可以确认<div ng-view></div>在角度2 AppComponent组件中是否有效。（将AppComponent添加到AppModule＆＃39; bootstrap数组中。

使用HybridUrlHandlingStrategy来阻止Angular在请求ng1路由时抛出错误。

使用空（＆＃34;＆＃34;）模板添加虚拟路径，以防止ng1在请求ng2页面时呈现404页面：

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

混合AngularJS和Angular 2路由时的通配符路径

1 个答案: