I am working on a directive but I don't want to play with $document or $window, only with the element itself.

Before I had:

angular.element($document).ready(function() {...});

and was working, just a few minutes ago I changed, and put:

element.ready(function() {...});

and it is working also.

So, when I say element.ready(function() {...}) am I telling Angular to run that function when the element <my-directive></my-directive> is ready? or what am I doing?

I am asking this because I am wondering, why it is still working if I do element.ready instead.

I am working on a directive but I don't want to play with $document or $window, only with the element itself.

Before I had:

angular.element($document).ready(function() {...});

and was working, just a few minutes ago I changed, and put:

element.ready(function() {...});

and it is working also.

So, when I say element.ready(function() {...}) am I telling Angular to run that function when the element <my-directive></my-directive> is ready? or what am I doing?

I am asking this because I am wondering, why it is still working if I do element.ready instead.

• javascript
• angularjs

Share Improve this question Follow asked Jul 13, 2015 at 22:20 NonNon 8,6192020 gold badges8080 silver badges130130 bronze badges 0

Add a ment  | 

2 Answers 2

Sorted by: Reset to default 6

You don't need either.

ready isn't needed since element has to exist for link function to fire. Also there is no element level ready event ... it is only used at document level to account for full body of page existing. That stage is long over when angular is piling directives.

You can do any manipulation or event binding directly to element immediately within link function of directive

In angularjs, angular.element is a jqLite object

And element in angular directive is a jqLite object and you dont need to wrap again with angular.element

for example in this code all elements is same

var element1 = angular.element( document.getElementById('test') ); // a jqLite object

var element2 = angular.element( element1 ); // same jqLite object

var element3 = angular.element( element2 ); // same jqLite object

By the way you don't need ready because directives links call when element ready