The problem is when I run my app, it works fine. But when I refresh it, most of the time I get below msg.
The selector \"my-app\" did not match any e
Django+Angular
I had a custom index.html, not the one generated by angular CLI.
I had this error because I placed the generated script files in the <head>
section instead of at the end of the closing </body>
tag (after the <app-root></app-root>
tags)
Maybe you could use the
defer
Tag in your headers js-files.
http://www.w3schools.com/TAgs/att_script_defer.asp
If you are using the angular2 / asp.net core template from here: http://blog.stevensanderson.com/2016/10/04/angular2-template-for-visual-studio/ you might find replacing the last few lines of boot-client.ts with the following helps (and avoids a lot of scary looking console errors when HMR reloads your page):
const bootApplication = () => { platform.bootstrapModule(AppModule); };
if (document.readyState === 'complete') {
window.onload = () => bootApplication();
location.reload();
} else {
document.addEventListener('DOMContentLoaded', bootApplication);
}
When i create new component need to follow below steps to resolve the below issues.
Step-1- Create new comonent with ng g c lakshya
.
Step-2- Under app lakshya folfer created with 4 files.
Step-3- Index.html need <app-root></app-root>
to <app-lakshya></app-lakshya>
Step 4- app.Module.ts file change bootstrap: [AppComponent] to bootstrap: [LakshyaComponent]
so above error resolve.
This happened to me when I changed the bootstrap component from AppComponent
to a new component. When you change it you need to change it in the main index.html
as well. index.html
should contain the bootstrap component.
For example, if you change the app-component
to app-login
in app.module.ts
in the bootstrap section then you should update your index.html
like this
<body>
<app-login></app-login>
</body>
In your app.module.ts, if you have my-app in the bootstrap, comment or delete it.
bootstrap: [ AppComponent, // my-app ]