0
Follow
0
View

How to render different Pages(Strapi Collection) on same Angular Component with help of navigation menu?

dujiang001 注册会员
2023-01-25 14:00

I wanna post an answer to my Problem, maybe someone will encounter the same problem in a future. I'm not sure it is a correct way but it's working for now.

This video helped me: https://www.youtube.com/watch?v=JT3s9HQxc1c

Please let me know if someone have better solution to this problem.

I used ActivatedRoute to get my current url and i've wrote a function to GET one page by ID and I'm giving my ID from current Route as param to my function.

page.component.ts

export class PageComponent implements OnInit {
  page?: Page;
  pageID?:  {id: number;};
  constructor(private pageSvc: PageService,private route: ActivatedRoute) {
  }

  ngOnInit(): void {
  this.pageID =  {
    id: this.route.snapshot.params['id']
  }
    this.getSpecificPage(this.pageID.id);
    // this.getPages();
  }

  // getPages() {
  //   this.pageSvc.getAllPages().subscribe(res => {
  //     this.pages = res;
  //   })
  // }

  getSpecificPage(id: any) {
    return this.pageSvc.getPage(id).subscribe( res => {
      this.page = res;
      console.log(this.page)
    })
  }
}


app.routing.module.ts

const routes: Routes = [
  {
    path: '',
    redirectTo: 'pages',
    pathMatch: 'full'
  },
  {
    path: 'pages/:id',
    component: PageComponent,
  }
];


About the Author

Question Info

Publish Time
2023-01-25 14:00
Update Time
2023-01-25 14:00