El problema es que cuando ejecuto mi aplicación, funciona bien. Pero cuando lo actualizo, la mayoría de las veces me sale por debajo de msg.
El selector "mi-aplicación" no coincidió con ningún elemento
Pero lo extraño es que muchas veces cuando actualizo mi aplicación también funciona.
Entonces, en última instancia, tengo un comportamiento extraño de mi aplicación y no puedo resolver esto.
A veces funciona, a veces no...
¿Alguna sugerencia, no se me ocurre el código?
Nota: todavía no tengo una estructura o componentes complejos, sino una implementación simple.
Esto me sucedió porque estaba importando mi código en la etiqueta head , por lo que potencialmente se estaba ejecutando e intentando arrancar antes de que el DOM estuviera listo.
Puede mover la secuencia de comandos a la parte inferior de la etiqueta del body o colocar el código de arranque dentro de un detector de eventos:
document.addEventListener("DOMContentLoaded", function(event) { bootstrap(AppComponent); });o:
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>Example app</title> </head> <body> <my-app></my-app> </body> <script src="main.js" charset="utf-8"></script> </html>Angular 4: tuve que cambiar <app-root></app-root> con <my-app></my-app> en el archivo index.html
Cosas para hacer:
Compruebe si tiene parte " boostrap :" - si no, agregue:
bootstrap: [AppComponent] // donde AppComponent es su componente principal
Verifique si funciona ahora, si no, vaya a AppComponent y verifique su selector . Debe ser igual que las etiquetas en el cuerpo en index.html
entonces index.html debería contener algo como esto:
<body> <app-root>Loading...</app-root> </body> donde en lugar de <app-root> debe usar el selector de AppComponent principal