I have a problem with a custom input component, which is supposed to work as a replacement for an <input>. Everything works fine except how clicks on a <label> that is targeting my component works. Reading the docs on label, I expect to get a click event on my component when the label is clicked, but I don't get anything. I.e. my HTML looks like this: <label for="mycomponent">Some label</label> <my-component id="mycomponent"></my-component> with my-component being a component that implements a @HostListener for click. The problem I have now is that the click handler is never triggered by clicking the label, it works of course if I click directly on the component. How can I react to the label being clicked inside the component so that I can manually forward this to the input inside my component? I've created a sample project here: https://github.com/Anteru/ng-component-focus-test The behavior I want is that both labels work the same, i.e. clicking on the label focuses the input. For the user, it shouldn't make a difference if they use a "plain old" input or my fancy component. Continue reading...
