The example really is this simple and it us not a problem with imports. In order for bootstrap to get to the point where it is looking for the element in the DOM and throwing this error, all imports would have to be completed and all Javascript interpreted successfully. Otherwise, there would be no annotated class for it to inspect and no way for it to know to look for this element.
I'm going to move the call to bootstrap into the onload event of the document to see if that helps. On Sun, Jul 10, 2016, 12:56 Gerard Lanphear <[email protected]> wrote: > I Think that Steven may be on point with his latest comment. template: > template is not a thing. Also, I am not sure what passing an empty > directives declaration is going to do. It's probably OK, but not sure about > that. Key to many issues is showing us the imports. My main.ts has just one > command bootstrap(AppComponent) and AppComponent has a bunch more in it > than you show here. I hate to say this because it burns me everytime I read > it, but maybe try a plunkr. > > > On Friday, July 8, 2016 at 2:10:20 PM UTC-7, Lucas Lacroix wrote: >> >> I'm not sure what's going on here. >> This is my index.html: >> <html> >> <head> >> ... >> </head> >> <body> >> <login>Initializing...</login> >> </body> >> </html> >> >> The component passed into bootstrap is as follows: >> @Component({ >> selector: 'login', >> template: template, >> styles: [style.toString()], >> directives: [] >> }) >> export class Login { >> constructor() { >> >> } >> } >> >> Yet, when I load my application, I get this exception in the console: >> browser_adapter.js:77EXCEPTION: Error: Uncaught (in promise): EXCEPTION: >> Error in :0:0 >> ORIGINAL EXCEPTION: The selector "login" did not match any elements >> ORIGINAL STACKTRACE: >> Error: The selector "login" did not match any elements >> at new BaseException (https: >> //apis.localhost/apps/login/app/vendor.js:37578:24) >> at DomRenderer.selectRootElement (https: >> //apis.localhost/apps/login/app/vendor.js:37915:24) >> at DebugDomRenderer.selectRootElement (https: >> //apis.localhost/apps/login/app/vendor.js:13318:40) >> at DebugAppView.AppView.selectOrCreateHostElement (https: >> //apis.localhost/apps/login/app/vendor.js:12866:42) >> at DebugAppView._View_Login_Host0.createInternal (Login_Host.template >> .js:12:21) >> at DebugAppView.AppView.create (https: >> //apis.localhost/apps/login/app/vendor.js:12844:22) >> at DebugAppView.create (https: >> //apis.localhost/apps/login/app/vendor.js:13037:45) >> at ComponentFactory.create (https: >> //apis.localhost/apps/login/app/vendor.js:9594:37) >> at https://apis.localhost/apps/login/app/vendor.js:7365:45 >> at https://apis.localhost/apps/login/app/vendor.js:7343:27 >> >> This is my third Angular2 app and this is the only time this has >> happened. I tried changing the element and selector to "login-form", but >> the same issue persisted. >> > -- > You received this message because you are subscribed to the Google Groups > "AngularJS" group. > To unsubscribe from this group and stop receiving emails from it, send an > email to [email protected]. > To post to this group, send email to [email protected]. > Visit this group at https://groups.google.com/group/angular. > For more options, visit https://groups.google.com/d/optout. > -- You received this message because you are subscribed to the Google Groups "AngularJS" group. To unsubscribe from this group and stop receiving emails from it, send an email to [email protected]. To post to this group, send email to [email protected]. Visit this group at https://groups.google.com/group/angular. For more options, visit https://groups.google.com/d/optout.
