asb14690
asb14690

Reputation: 1837

calculate Dynamicaly height of DOM in AngularJS

I want to measure height of DOM element in AngularJS when DOM Load is complete.

myApp.directive('domHeight',['$timeout',function($timeout){
  return{
    restrict:'EA',
    scope:true,
    link:function(scope,element,attrs){
         $(document).ready(function(){
            $('.required-wrapper').load(function(){
              console.log( $('.required-wrapper').height());
            })
           
         })
    }
  }
}])
**above code i trigger height before DOM Load **

Upvotes: 1

Views: 100

Answers (2)

asb14690
asb14690

Reputation: 1837

    myApp.directive('domHeight',['$timeout',function($timeout){
  return{
    restrict:'EA',
    scope:true,
    link:function(scope,element,attrs){
        attrs.$observe(function(){
            $timeout(function(){
               $(document).ready(function(){
               $('.required-wrapper').load(function(){
              
               })
           
           })
              
              
              ),true)
           
        })
         
    }
  }
}])

Upvotes: 0

David Votrubec
David Votrubec

Reputation: 4156

I would try use $timeout like this

NOT TESTED

    $('.required-wrapper').load(function(){
      $timeout(function() {
        //As far as I know there is no event which would notify you that the loaded DOM has rendered
        //So I would use the timeout instead
        console.log( $('.required-wrapper').height());
      }, 100);  
    })

Upvotes: 1

Related Questions