0
200
ViewsAngular how to check from which component is a div
I'm interested in how to check in console which component was rendered. I mean, let's assume that in console -> Elements you can see a lot of divs, for example. How can you check from which component are this divs coming?
2 answers
Answer question0
@Component({
selector: 'my-component',
template: '<div><div></div></div>'
})
export class MyComponent {
...
}
If you add the component above in your app, you should be able to see <my-component>...</my-component> in your DevTools > Elements panel.
You can also use the Angular DevTools extension to explore the HTML of your components.
0
You can simply inspect the HTMLin Chromes' Dev Tools. Simply by right-clicking and selecting inspect. In the Elements section where all of the page's HTML is shown you can see different <div> etc. If you observe it closely there are also tags of components that are used by angular to display those <div>.
For example, in the simple stackblitz Angular project. Simple inspection of the HTML will show us this
Here you can see that <h1> is inside the hello-component of Angular which is shown by <hello .... > tag. Which is inside another component my-app-component called <my-app...>. By this logic, you can easily see which HTML is inside which Angular Component