angular 2路由器混合应用程序:导航后url恢复

Question

每个路由更改都会呈现正确的组件，但路径有问题
例如，从/items导航到/add项目更改和url一秒钟，然后将其还原。
无论从哪里开始，从哪里去，它都会在每个页面上发生。

导航

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

主应用程序路由.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'
}];

home.routes.ts

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

page-not-found.routes.ts

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

add-item.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路由将遇到这个问题。

或者你可以用这样一个破解关闭Angular.js路由操作

$provide.decorator('$browser', ['$delegate', ($delegate) => {
$delegate.onUrlChange = () => {};
$delegate.url = () => {
return '';
};
return $delegate;
}]);