Emberjs: Get the current element

Question

I am looking for something that's similar to the this of jQuery. I'm going to list below the code I have:

<script type="text/x-handlebars" data-template-name="uiMainContainerTaskList">
    <div class="uiMainContainerTaskListContent">
    {{#view App.TasksView}}
    {{#each App.tasksController.tasks}}
    <div class="uiMainContainerWideItem" {{action "taskClick" target="TasksView" on="click"}}>
        <div class="uiMainContainerWideItemCheckbox">{{view Em.Checkbox checkedBinding="isDone"}}</div>
        <div class="uiMainContainerWideItemText uiMainContainerWideItemTaskName">{{taskName}}</div>
        <div class="uiMainContainerWideItemText uiMainContainerWideItemTaskDescription">{{taskDescription}}</div>
        <div class="uiMainContainerWideItemText uiMainContainerWideItemTaskPriority">{{priority}}</div>
        <div class="uiMainContainerWideItemText uiMainContainerWideItemTaskDueDate">{{dueDate}}</div>
    </div>
    {{/each}}
    {{/view}}
    </div>
</script>  

I bind the taskClick action to the div.uiMainContainerWideItem. In my View I have:

App.TasksView = Em.View.extend({
    templateName: 'uiMainContainerTaskList',
        taskClick: function(e) {
            console.log($(this)); 
        }
});  

In jQuery, $(this) would be the current element (no children). Is there a way to get the current element in Ember as well?

Answer 1

I believe you are looking for this.$().

Answer 2

You can call this.get('element') to get the actual element.

See: Ember View Documentation

Answer 3

I know is an old question but since views are deprecated (and if you are not needing this for a component), you can pass the action to the dom onclick event and get the event js object in the last parameter of the action.

Please check https://stackoverflow.com/a/37066157/2726189

hope it helps