Component based architecture

RootComponent

<app-root>

</app-root>

Component

RootComponent

<app-root>

 

 

</app-root>

<router-outlet>

</router-outlet>

<app-root>

 

 

 

 

</app-root>

<router-outlet>

 

 

</router-outlet>

Component

RootComponent

C

o

m

p

o

n

e

n

t

<page-home>

</page-home>

Component

Component

Component

RootComponent

C

o

m

p

o

n

e

n

t

<app-root>

 

 

 

 

 

 

 

 

</app-root>

<router-outlet>

 

 

 

 

 

 

</router-outlet>

<page-home>

 

 

 

 

</page-home>

<home-header>

</home-header>

<list-content>

</list-content>

Component

Component

Component

Component

Component

Component

Component

RootComponent

C

o

m

p

o

n

e

n

t

<app-root>

 

 

 

 

 

 

 

 

 

 

</app-root>

<router-outlet>

 

 

 

 

 

 

 

 

</router-outlet>

<page-home>

 

 

 

 

 

 

</page-home>

<list-content>

 

 

</list-content>

<list-item>

</list-item>

<home-header>

</home-header>