Angular 4: (click) event on <option>-Tag not firing in IE11

Question

In my application i'm using the angular (click)-Event on an option-tag. The event is fired correctly in Chrome and Firefox. Sadly it isn't fired in IE11.

My code looks like this:

<select ...>
    <ng-template ngFor ...>
        <optgroup ...>
            <option ... (click)="fireEvent()">...</option>
        </optgroup>
    </ng-template>
</select>

(The "..." are just abbreviations for some attributes that doesn't have any influence here.)

According to some other internet sources, my problem with the IE11 and the click Event in angular seems to be a known issue since....let's just say since a long time :D

There are some solutions for other HTML-Structures which doesn't work in this case.

Does anyone know some workaround for the IE11 ?

Answer 1

I found a solution for this issue on my own. I didn't manage to get the click event running, so i tried to implement a workaround. My workaround is using the (change) event on the Tag. Everytime i click on another option the (change) event is emitted. The model for the currently selected Item is still updated in my angular component, so everything seems fine.

<select ... (change)="fireEvent()">
<ng-template ngFor ...>
    <optgroup ...>
        <option ... >...</option>
    </optgroup>
</ng-template>