0
208
VistasAngular cómo verificar de qué componente es un div
Estoy interesado en cómo verificar en la consola qué componente se representó. Quiero decir, supongamos que en la consola -> Elementos puedes ver muchos divs, por ejemplo. ¿Cómo puede verificar de qué componente provienen estos divs?
2 Respuestas
Responde la pregunta0
@Component({ selector: 'my-component', template: '<div><div></div></div>' }) export class MyComponent { ... } Si agrega el componente anterior en su aplicación, debería poder ver <my-component>...</my-component> en su panel DevTools > Elements.
También puede usar la extensión Angular DevTools para explorar el HTML de sus componentes.
0
Simplemente puede inspeccionar el HTML en las herramientas de desarrollo de Chrome. Simplemente haciendo clic derecho y seleccionando inspect . En la sección Elements , donde se muestra todo el HTML de la página, puede ver diferentes <div> , etc. Si lo observa de cerca, también hay etiquetas de componentes que angular usa para mostrar esos <div> .
Por ejemplo, en el proyecto Angular de stackblitz simple. La simple inspección del HTML nos mostrará esto
Aquí puede ver que <h1> está dentro del hello-component de Angular que se muestra con la etiqueta <hello .... > . Que está dentro de otro componente my-app-component llamado <my-app...> . Con esta lógica, puede ver fácilmente qué HTML está dentro de qué componente angular