Angular — Using component-level scoped service to communicate between parent and children

Liu Ting Chun
4 min readFeb 21, 2020

Service is one of the fundamental concepts of Angular for managing shared state and logic. Do you know service can be in component-level? It is very useful for implementing component with dynamic child components, for example:

<google-map [key]="apiKey">
<google-map-marker *ngFor="let marker of markers"
[lat]="marker.lat"
[lng]="marker.lng">
</google-map-marker>
</google-map>

--

--

Liu Ting Chun

Web developer from Hong Kong. Most interested in Angular and Vue. Currently working on a Nuxt.js + NestJS project.