การกำหนดเส้นทางเชิงมุมในหน้าเดียวกัน

Aug 19 2020

ฉันต้องการใช้การกำหนดเส้นทางเชิงมุมในหน้าเดียวกันโดยมีส่วนประกอบเดียวกันทั้งหมดไม่ว่าจะเป็น / frontpage หรือ / frontpage / param1 / param2 / param3 แต่เพิ่งอัปเดตองค์ประกอบลูก ๆ ของฉันด้วยพารามิเตอร์ param1 param2 param3 ..

ฉันมีส่วนประกอบส่วนหน้าซึ่งมีส่วนประกอบลูก ๆ (และลูก ๆ ) จำนวนมาก

ฉันกำลังสร้างวิธีที่ไม่มีการเปลี่ยนแปลง URL และเป็นเพียง / frontpage แต่ฉันต้องการเพิ่มคำค้นหาและพารามิเตอร์ลงใน url เพื่ออัปเดตบุตรหลานของฉัน

แต่ฉันไม่ค่อยเข้าใจวิธีการทำเช่นนี้

app.routing.ts

  {
    path: '',
    redirectTo: 'frontpage',
    pathMatch: 'full',
  },
  {
    path: '404',
    component: P404Component,
    data: {
      title: 'Page 404'
    }
  },
{
    path: '', // honestly I just realized this was here lol. I can probably take this out right? lol.. It was part of the base I am using.
    component: DefaultLayoutComponent,
    data: {
      title: 'Home'
    },
    children: [
      {
        path: 'frontpage',
        loadChildren: () => import(etcetc).then(m => m.FrontpageModule)
      },

frontpage-Routing.module.ts

  {
    path: '',
    component: FrontpageComponent,
    data: {
      title: 'Frontpage'
    },
  },

ฉันจะเพิ่ม /: param1 /: param2 /: param3 ได้ที่ไหน ??

ขอบคุณ!

คำตอบ

itspers Aug 19 2020 at 06:32

ไม่มีพารามิเตอร์เสริมในการกำหนดเส้นทาง - เพียงเขียนเส้นทางที่สอง หากมีเหตุผลแปลก ๆ คุณต้องการลูกจำนวนมากที่นั่น - แยกมันไปยังตัวแปรบางตัวและส่งผ่านเข้าไปข้างใน เส้นทางเป็นเพียงการกำหนดค่าผ่านโทเค็นไม่ใช่เรื่องใหญ่

  const toneOfChildren = [...];
  {
    path: '',
    component: FrontpageComponent,
    children: toneOfChildren  
  },
  {
    path: ':param1/:param2/:param3',
    component: FrontpageComponent,
    children: toneOfChildren  
  },

และFrontpageComponentเพียงแค่สมัครรับพารามิเตอร์และดูว่าพวกเขาอยู่ที่นี่หรือไม่