Assuming the following HTML:

<div *nfFor="let option of options" (click)="option.check = !option.check; selectionChanged.emit(option)">
    <input type="radio" [(ngModel)]="option.check" (ngModelChange)="selectionChanged.emit(option)"/>
    ...additional elements related to input
</div>

I want to prevent the event from being emitted twice when clicked on the div instead of directly on the input. As far as I know the click is only registered once, if clicked directly on the input it'll fire that but if clicked outside of the input but within the div it'll execute the (click) statement.

So anyway the question is wether there will be two emits on selectionChanged when clicked on the div as there's also an ngModelChange on the input element itself. Does ngModelChange recognize changes on the ngModel bound property from outside the element it is attached to and therefore fire?

NOTE: I know the radio button has two event bindings which isn't the right way to go about things in Angular (I think, two chefs in the kitchen?) but that's something i'll fix later if necessary