CODEWITHSUNDEEP
javascriptangularjs
Devin Dixon
Devin Dixon

Reputation: 12403

AngularJS Get Element Attributes without JQuery

I am working on creating a AngularJS site that DOES NOT use JQuery. In a directive, the values that are passed are

EngagementApp.directive('movingAside', function() {
    return {
        restrict : 'A',
        link : function(scope, element, attributes) {

      }
    }
});

And html looks like:

<div class="aside" moving-aside>...Content...</div>

Doing things like element.clientHeight returns an undefined.

How can get the attributes(height, width, offset, etc) of the element without using JQuery and only AngularJS functions?

Upvotes: 3

Views: 11031

Answers (2)

Marko
Marko

Reputation: 72232

Use element[0].clientHeight | offsetHeight | scrollHeight

element[0] gives you access to the first DOM element in the JQLite selector collection while clientHeight is a built in property of the DOM element.

EngagementApp.directive('movingAside', function() {
    return {
        restrict : 'A',
        link : function(scope, element, attributes) {
            console.log(element[0].clientHeight);
      }
    }
});

There are 3 different heights you can get depending on what you're after:

Upvotes: 14

massintha
massintha

Reputation: 214

Try angular.element(element).css('height')

Upvotes: 0

Related Questions