angular2 input not self close
angular, typescript
Solution
The `input` tag is a void element, thus has to be self-closing. The Angular 2 template parser is just very strict about it.
The HTML sepcification gets more specific on this topic:
A void element is an element whose content model never allows it to have contents under any circumstances. Void elements can have attributes.
Other void elements are: `area`, `base`, `br`, `col`, `command`, `embed`, `hr`, `img`, `keygen`, `link`, `meta`, `param`, `source`, `track` and `wbr`.
Problem
I'm learning a bit of angular2 and I can't find info about this issue. When I don't self close an `<input>` tag I get a parse error. This is so strange for me. Furthermore, it seems to be a bug but I can't find any reason or discussion about this. ``` @Component({ selector: 'my-app', template: `<h1>My First Angular App</h1> {{greeting}} <br/> {{product.id}} {{product.name}} {{product.price}} <br/> <span [innerHtml]="product.id"></span> <span [innerHtml]="product.name"></span> <span [innerHtml]="product.price"></span> <br/> <input [(ngModel)]="product.id"/> //Here is working correctly ` }) ``` If I do the same but in this way I get the parse error. ``` @Component({ selector: 'my-app', template: `<h1>My First Angular App</h1> {{greeting}} <br/> {{product.id}} {{product.name}} {{product.price}} <br/> <span [innerHtml]="product.id"></span> <span [innerHtml]="product.name"></span> <span [innerHtml]="product.price"></span> <br/> <input [(ngModel)]="product.id"></input> //Here I get a Parse error ` }) ``` Any help info or link about this error will be so helpful. Thank you