EXCEPTION: Template parse errors: Only void and foreign elements can be self closed "meta"

In the reality, despite the other answer, the real cause of the problems can be found in the BREAKING CHANGES section of the angular2 changelog, at version 2.0.0-alpha48:

End tags used to be tolerated for void elements with no content. They are no more allowed so that we more closely follow the HTML5 spec.

Thus, if you had a code like <example a="b" />, for example you read it in an example in the internet to an angular2 version earlier as 2.0.0-alpha48, it won't work.

But, <example a="b"></example> will work!

The angular2 developers think, they want to follow HTML5 "more closely". My opinion about what should they do, is quite different.

It is not clear, what the doc or the error message understands on "void or foreign elements". I suspect, maybe using a different html namespace for our own tags, (i.e. having a <myapp:example a="b" />) will maybe also work.


The issue was that, of course, I had a typo. The .html at templateUrl: was missing.

I had:

@Component({ 
    selector: 'my-header',
    templateUrl: './dest/App/MyHeader',
    styles: [],
    directives: [ FORM_DIRECTIVES, COMMON_DIRECTIVES ] 
})

and I was supposed to have

@Component({ 
    selector: 'my-header',
    templateUrl: './dest/App/MyHeader.html',
    styles: [],
    directives: [ FORM_DIRECTIVES, COMMON_DIRECTIVES ] 
})

Tags:

Angular