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>
Reusability
Consistency
Modularity
Maintainability
Faster
development