Angular 2路由器混合应用程序：导航后网址恢复回来

Question

每次路线更改都会渲染正确的组件，但路径存在问题。
例如，从 /items 导航到 /add-item 更改和 url 一秒钟，然后恢复它。
无论从哪里开始，到哪里去，它都会发生在每一页上。

导航

<a routerLink="/add-item">Add item</a>

主要app.routes.ts

export const appRoutes: Routes = [{
    path: 'brokers',
    pathMatch: 'full',
    redirectTo: '/'
},
{
    path: 'sellers',
    pathMatch: 'full',
    redirectTo: '/'
},
{
    path: 'buyers',
    pathMatch: 'full',
    redirectTo: '/'
},
{
    data: { name: 'pageNotFound' },
    path: '**',
    redirectTo: '/404'
}];

主页.routes.ts

export const homeRoutes: Routes = [{
    component: HomePageComponent,
    data: { name: 'homePage' },
    path: ''
}

页面未找到.routes.ts

export const pageNotFoundRoutes: Routes = [{
    component: PageNotFoundComponent,
    data: { name: 'pageNotFound' },
    path: '404'
}]

添加项目.routes.ts

export const addItemRoutes: Routes = [{
    component: AddItemComponent,
    data: { name: 'addItem' },
    path: 'add-item'
}]

items.routes.ts

export const itemsRoutes: Routes = [{
    component: ItemsComponent,
    data: { name: 'items' },
    path: 'items'
}];

所有模块的路由都在导入部分声明，如下所示

RouterModule.forChild(addItemRoutes)

主要航线

RouterModule.forRoot(appRoutes, { enableTracing: true })

路由器跟踪没有给我任何错误，并且在 NavigationEnd 事件上纠正 urlAfterRedirects。

Answer 1

仅供遇到同样问题的人参考。
如果你有 AngularJS 到 Angular 应用程序的混合，你必须保留旧的 $locationProvider 设置，例如$locationProvider.html5Mode({ enabled: true, requireBase: false });
否则你的新 Angular 路由将遇到这个问题。

或者你可以通过这样的 hack 关闭 Angular.js 路由操作

$provide.decorator('$browser', ['$delegate', ($delegate) => {

    $delegate.onUrlChange = () => {};
    $delegate.url = () => {

        return '';

    };

    return $delegate;

}]);