This is my Angular code:

angular.module('player', [])
.directive('playButton', function() {
    return {
        restrict: 'A',
                    /* I want to get the element parameter bellow as HTMl, 
                    not an object with an element stored within.
                    I don't want to access the HTML element as element[0]*/
        link: function($scope, /* this parameter -> */ element, attr) {
            console.log(typeof(element));
            // element[0].addEvent('click', function() {
            //  console.log('Moo!');
            // });
        }
    }
})

What i want to achieve is getting the element parameter within the link method as html, so that i can manipulate it with MooTools. Is there any way to prevent the use of the [0] after the element variable?

This is my Angular code:

angular.module('player', [])
.directive('playButton', function() {
    return {
        restrict: 'A',
                    /* I want to get the element parameter bellow as HTMl, 
                    not an object with an element stored within.
                    I don't want to access the HTML element as element[0]*/
        link: function($scope, /* this parameter -> */ element, attr) {
            console.log(typeof(element));
            // element[0].addEvent('click', function() {
            //  console.log('Moo!');
            // });
        }
    }
})

What i want to achieve is getting the element parameter within the link method as html, so that i can manipulate it with MooTools. Is there any way to prevent the use of the [0] after the element variable?

• javascript
• angularjs
• mootools

1 Answer 1

No. Angular return a jQlite object. So, like jQuery, to select current html element you need to use element[0]. An alternative would be to assign a variable to element[0].

var elm = element[0];

elm.addEvent('click', function() {
     console.log('Moo!');
 });