Home > front end >  how to identify parent and child component in angular?
how to identify parent and child component in angular?

Time:11-24

I'm currently learning angular and how to share data between components. I understand the basic idea of parent and child component but not sure how to identify if a component is a parent or child. And whether or not if there are multiple parent components or each angular application only have one parent component and the rest is child component. I tried researching on google and watch some youtube tutorials but none seems to answer my question.

CodePudding user response:

A parent can have multiple childs, a parent can also be a child. A child only has one parent.

The parent defines his child usually in template.

parent.component.html

<app-child [data]="someDataPassedFromParentToChild"></app-child>

CodePudding user response:

Typically your entry point is your app.component.ts/html. That is your root parent component. Every other component you create will be a direct child of app.component or a child of its children. e.g. angular components look like a big tree with app.component.ts/html at its root.

CodePudding user response:

Each component in angular can be a parent for many components and a child component can have only one parent. Think about it like one to many relationship.

Angular App starts from the bootstrap array in your root AppModule Wich usually contains one component to be rendered in your index.html dom.

If you are using angular routes, then each component rendered in the router outlet in the bootstrap component will be the entry component to all other children of it.

If you are not using the angular routes, then the bootstrap component ist the root component and the first parent in your app.

Checkout angular documentation about the bootstrap array.

  • Related