Business
Jobs
  • About Us
  • Solutions
    • Job Postings
      Post your job and receive qualified candidates in 48h.
    • Candidate Assessments
      500+ technical and psychological tests, plus anti-fraud.
    • Headhunting
      Tailor-made executive search from start to finish.
    • Payroll + EOR
      Payroll dispersal and EOR across 15+ LATAM countries.
  • Pricing
  • Jobs

0

250
Views
Angular: How to do the Components Architecture the right way?

I'm currently trying to create a Angular-Webpage for a Uni-Project. Therefore i've built up a Webshop-MockUp with several different Pages like

  • Startscreen
  • Productscreen
  • Register/Loginscreen
  • Shopping-Cart Screen
  • Order-Screen
  • and Profile-Screen.

But as I'm now trying to develop the Webshop with Angular, I'm not quite sure, how the Architecture of the Component-Concept of Angular will fit to my needs.

As long as I understand for now it's working like that: You create a Page with several (reusable) Components which all define different areas of one page.

For the example of the Startscreen, i've created the components:

  • hero-banner
  • header
  • filtering
  • product-overview
  • shopping-cart (will be shown on the right side)

These 5 Components can then be added to the app.components.html to show the first page.

But now I have no idea, how to create the other 5 pages and display them inside the app.component.

I've heard about the Routing to switch between components..

But does that mean I have to create one parent-component for every page where I tipe in these different components I've been creating?

And if so, what do I write into the app.component.html if I can Route between the different components anyways?

I just got a big knot in the head right now and I really hope you can help me out here!

Thanks in Advance!

about 4 years ago · Juan Pablo Isaza
1 answers
Answer question

0

Yep parent component for each page to act as manager component to talk to services, get data, and pass it down to dumb components and handle events from child components. Make your children dumb. This is known as container-component.

Yep learn routing. Also lazy load whenever you can but you can refactor this in later.

<router-outlet></router-outlet> goes in app.component.html.

Possibly something like

<app-navbar>
    Text to display via ng-content
</app-navbar> <!-- Common to all routes/pages --!>

<router-outlet></router-outlet>
about 4 years ago · Juan Pablo Isaza Report
Answer question
Find remote jobs

Discover the new way to find a job!

Top jobs
Top job categories
Business
Post vacancy Pricing Sales
Legal
Terms and conditions Privacy policy
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Show me some job opportunities
There's an error!