Duplicate "id" attribute in Angular 2 component
You can pass id
as expression:
<my-checkbox [id]="'hello'">Check me</my-checkbox>
In this case component tag does not contain id
attribute in DOM, it contains only attribute ng-reflect-id
, which does not affect default behavior for label.
I would simply rename the checkbox's id (and hence the label's for
attribute) so that it doesn't clash with the component's id, like so:
<input id="{{ id }}-checkbox" …>
<label for="{{ id }}-checkbox">…</label>