vendor.js:55639 ERROR Error: Uncaught (in promise): Error: Cannot match any routes. URL Segment: 'create/path1'

x.componet.ts

const path="path1"

x.component.html

[routerLink]="['create',path]"

<router-outlet name="modal"></router-outlet>

modulex-routing.module.ts

const routes: Routes = [
  {
    path:'create',
    children:[
      {
        path:'path1',component:path1Component,outlet:'modal'
      },
      {
        path:'path2',component:path2Component,outlet:'modal'
      },

    ],
  }
];

@NgModule({
  imports: [RouterModule.forChild(routes)],
  exports: [RouterModule]
})
export class HomeRoutingModule { }

app.routing.module.ts

const routes: Routes = [
  {
    path:'',
    component:HomeComponent,
    outlet:'home'
  },
 ];

@NgModule({
  imports: [RouterModule.forRoot(routes,{
    preloadingStrategy: PreloadAllModules
  })],
  exports: [RouterModule]
})

app.module.ts

@NgModule({
  declarations: [
    AppComponent,
  ],
  imports: [
    BrowserModule,
    BrowserAnimationsModule,
    HomeRoutingModule,
    AppRoutingModule,
    HomeModule
  ],
  providers: [
    DatePipe
  ],
  bootstrap: [AppComponent]
})
export class AppModule { }

ERROR Error: Uncaught (in promise): Error: Cannot match any routes. URL Segment: 'create/path1'

in modulex routing created some routes with respective components and in app-routing using preloadmodule approach , when tries to access 'create/path1' it says

Error: Cannot match any routes.

am I Missing anything?

if remove outlet name everything works