Praveenkumar
Praveenkumar

Reputation: 11

Why this.$ is not available in Ember Controller

Ember.$ is available in the controller whereas this.$ is not. But it is available in components.

Ember.$(".loading-splash").hide(); is working on controller where as this.$(".loading-splash").hide(); is throwing an exception "this.$() is unavailable"

Upvotes: 1

Views: 55

Answers (1)

Gaurav
Gaurav

Reputation: 12796

Ember components have a this.element, a place in the DOM to which they are attached. Older versions of Ember, 3.x and below, wrap this element with a this.$() so that you can conveniently use JQuery with that element as a context.

For example, this.$('.some-class') will locate elements with some-class within the scope of the component, i.e. within the component's element. Ember.$('.some-class') will locate elements with some-class anywhere in the page.

JQuery integration was made an optional feature in Ember 3.4, was no longer enabled by default in 3.14, and finally deprecated late in 3.x cycle and removed in Ember 4.0.

Controllers and Glimmer components are not associated with an element in the DOM, so there is not this.element to wrap.

Upvotes: 4

Related Questions