1

我已经设置了一个单水疗根配置应用程序和其他 2 个以角度实现的子应用程序(使用parcels)。而且我正在尝试从根应用程序导航到子应用程序路由,它适用于第一条路/app1由,但是如果我想导航到/app1/search或者/app1/details它不加载关联的组件,尽管 url 已更改。

如果我最初点击/app1/search它会加载搜索组件,但之后如果我尝试导航到其他路线,例如/app1/<any-route>它会更改 url,但不会加载组件。

根配置 app.component.html

<a routerLink="/app1" routerLinkActive="active">App1 Home</a>
<a routerLink="/app1/search" routerLinkActive="active">App1 Search</a>
<a routerLink="/app1/details" routerLinkActive="active">App1 Details</a>
<a routerLink="/app2" routerLinkActive="active">App2 Home</a>


<router-outlet></router-outlet>

App1 路由模块:

const routes: Routes = [
  {
    path: 'app1',
    children: [
      {
        path: '',
        component: HomeComponent
      },
      {
        path: 'search',
        component: SearchComponent
      }, {
        path: 'details',
        component: DetailsComponent
      }]
  }, {
    path: '**',
    component: EmptyRouteComponent
  }
];

@NgModule({
  imports: [RouterModule.forRoot(routes)],
  exports: [RouterModule]
})
export class AppRoutingModule { }
4

2 回答 2

1

这将起作用

const routes: Routes = [
  {
    path: 'app1',
    component: HomeComponent
  },
  {
    path: 'app1/search',
    component: SearchComponent
  },
  {
    path: 'app1/details',
    component: DetailsComponent
  },
  {
    path: '**',
    component: EmptyRouteComponent
  }
];

如果你想创建一个孩子然后添加

home.component.html

<a routerLink="/search" routerLinkActive="active">App1 Search</a>
<a routerLink="/details" routerLinkActive="active">App1 Details</a>
<router-outlet></router-outlet>

然后使用如下路由器。

const routes: Routes = [
  {
    path: 'app1',
    component: HomeComponent
    children: [
      {
        path: 'search',
        component: SearchComponent
      }, {
        path: 'details',
        component: DetailsComponent
      }]
  }, {
    path: '**',
    component: EmptyRouteComponent
  }
];```
于 2021-08-20T13:54:42.650 回答
0

我不知道你是否能解决你的问题,但这可以帮助你。正如这个链接提到的配置路由,它的重要设置APP_BASE_HREF

所以在你的情况下这会起作用

providers: [{ provide: APP_BASE_HREF, useValue: '/app1' }]app-routing.module.ts

如果你设置你的APP_BASE_URL/你必须/app1在所有链接和路由中添加前缀。

于 2021-10-29T17:51:53.520 回答