CODEWITHSUNDEEP
javascripthtmlember.jsember-octane
Abe
Abe

Reputation: 441

Ember Octane (3.22+) why use {{on 'click' this.function}} instead of onclick={{this.function}}

So in Ember Octane there are two ways of attaching a function to an event in an hbs file.

The EmberJS way: {{on 'click' this.function}}

Classic HTML way: onclick={{this.function}}

Here they suggest using the prior syntax

However I don't see a reason why to use that syntax unless we have due reason to do so.

What are the reasons I would use the former over the latter?

Upvotes: 3

Views: 382

Answers (1)

Gaurav
Gaurav

Reputation: 12796

{{on 'click' this.function}}

uses addEventListener semantics from W3C DOM 1.0 spec and automatically cleans itself up with removeEventListener when the template is destroyed.

onClick={{this.function}}

uses the older DOM event semantics from HTML4, which

  1. does not allow multiple listeners
  2. does not propagate to outside elements
  3. swallows any events from nested elements

Upvotes: 7

Related Questions