It is the entire example except the CSS and HTML of the component have been excluded for brevity. They are inconsequential as the code isn't even getting as far as processing it - we are still bootstrapping which means we haven't even instantiated any components yet and the manipulation of the HTML and CSS hasn't occurred yet. Regardless, the HTML snippet is just a DIV tag and the CSS is empty.
Bootstrap is being called with a single argument: the login component class. It inspects the annotations on the class and sees the selector "login". It then searches the DOM for an element matching that selector and can't find it, therefore, bootstrapping fails. The error occurs before the component is instantiated. If it were a problem with the transpiled code, then it would be a different error - I know because I have seen that issue before. I have never seen bootstrap unable to find the element described by the selector on the main component. The only way I see this as happening is if bootstrap isn't waiting for the document onload event, which seems silly. So, if anyone else has seen this issue before, I'd appreciate their input. I have a second app which was used as the scaffold for this app and it works just fine. On Sat, Jul 9, 2016, 10:30 Steven Luke <[email protected]> wrote: > " The question is: how is bootstrap not finding the element when it > clearly and definitely exists." > As far as the bootstrapper knows, it doesn't exist. So you have to figure > out why not. There are various reasons (not transpiled because of error, > not in the location the code says it is, development not synced with the > running application)... > > "Additionally, document.getElementsByTagName('login') correctly returns > the login element." > Which tells you the <login></login> tags are in the DOM, as you would > guess from the fact that you put them in the index.html file. It does not > tell you anything else. Those tags should trigger a lookup for the > component with the login selector, but it doesn't find one. Which means > whatever you are expecting to be loaded is not being loaded, either because > you are passing in the wrong thing, or the right thing does not exist. > > I did a quick check to make sure <login> isn't some special keyword and it > isn't. See this plunker: https://embed.plnkr.co/8cYSrPackDFxPTas951o/. > That shows that there isn't anything special with <login></login> which > means any issues you are seeing are a problem with something you aren't > showing. > > > I assume when you have template: *template* that you are just shortening > your posted code to remove the actual template code right? > > -- > 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.
