Angular 2 - Issues using $event.srcElement on firefox

Question

I've many parts of my code that's uses @event.srcElement, for example...

<label><input (change)="setCompare($event.srcElement.checked,item.id, item.name, item.capacity, item.photoId,item.occupiers[0])" type="checkbox">Compare availability</label>

Works fine on Chrome, but using FF it's throws:

Error:

EXCEPTION: Error in app/templates/results.html:35:22 ORIGINAL EXCEPTION: TypeError: event.srcElement is undefined ORIGINAL STACKTRACE: ResultsComponent.prototype.onScroll@http://localhost:3002/app/components/results/results.component.js:124:9 anonymous/_View_ResultsComponent0.prototype._handle_scroll_13_0@ResultsComponent.template.js:268:15 DebugAppView.prototype.eventHandler/<@http://localhost:3002/node_modules/@angular/core/src/linker/view.js:316:24 decoratePreventDefault/<@http://localhost:3002/node_modules/@angular/platform-browser/src/dom/dom_renderer.js:278:36 DomEventsPlugin.prototype.addEventListener/outsideHandler/<@http://localhost:3002/node_modules/@angular/platform-browser/src/dom/events/dom_events.js:20:93 Zonehttp://localhost:3002/node_modules/zone.js/dist/zone.js:323:20 NgZoneImpl/this.inner<.onInvoke@http://localhost:3002/node_modules/@angular/core/src/zone/ng_zone_impl.js:45:32 Zonehttp://localhost:3002/node_modules/zone.js/dist/zone.js:322:20 Zonehttp://localhost:3002/node_modules/zone.js/dist/zone.js:230:29 NgZoneImpl.prototype.runInnerGuarded@http://localhost:3002/node_modules/@angular/core/src/zone/ng_zone_impl.js:78:67 NgZone.prototype.runGuarded@http://localhost:3002/node_modules/@angular/core/src/zone/ng_zone.js:228:58 DomEventsPlugin.prototype.addEventListener/outsideHandler@http://localhost:3002/node_modules/@angular/platform-browser/src/dom/events/dom_events.js:20:56 Zonehttp://localhost:3002/node_modules/zone.js/dist/zone.js:356:24 Zonehttp://localhost:3002/node_modules/zone.js/dist/zone.js:256:29 ZoneTask/this.invoke@http://localhost:3002/node_modules/zone.js/dist/zone.js:423:29

Any suggestions about how to fix it - or: Replace $event.srcElemento with something more browser agnostic ?

Answer 1

You can just use target instead of srcElement

$event.target.checked

See also https://developer.mozilla.org/en/docs/Web/API/Event/srcElement