Improve this Doc View Source angular.element
- function in module ng
Wraps a raw DOM element or HTML string as a jQuery element.
If jQuery is available, angular.element
is an alias for the jQuery function. If jQuery is not available, angular.element
delegates to Angular's built-in subset of jQuery, called "jQuery lite" or "jqLite."
jqLite is a tiny, API-compatible subset of jQuery that allows Angular to manipulate the DOM in a cross-browser compatible way. jqLite implements only the most commonly needed functionality with the goal of having a very small footprint.
To use jQuery
, simply ensure it is loaded before the angular.js
file.
Note: all element references in Angular are always wrapped with jQuery or jqLite; they are never raw DOM references.
Angular's jqLite
jqLite provides only the following jQuery methods:
addClass()
after()
append()
-
attr()
- Does not support functions as parameters -
bind()
- Does not support namespaces, selectors or eventData -
children()
- Does not support selectors clone()
contents()
-
css()
- Only retrieves inline-styles, does not callgetComputedStyle()
. As a setter, does not convert numbers to strings or append 'px'. data()
detach()
empty()
eq()
-
find()
- Limited to lookups by tag name hasClass()
html()
-
next()
- Does not support selectors -
on()
- Does not support namespaces, selectors or eventData -
off()
- Does not support namespaces or selectors -
one()
- Does not support namespaces or selectors -
parent()
- Does not support selectors prepend()
prop()
ready()
remove()
removeAttr()
removeClass()
removeData()
replaceWith()
text()
toggleClass()
-
triggerHandler()
- Passes a dummy event object to handlers. -
unbind()
- Does not support namespaces val()
wrap()
jQuery/jqLite Extras
Angular also provides the following additional methods and events to both jQuery and jqLite:
Events
-
$destroy
- AngularJS intercepts all jqLite/jQuery's DOM destruction apis and fires this event on all DOM nodes being removed. This can be used to clean up any 3rd party bindings to the DOM element before it is removed.
Methods
-
controller(name)
- retrieves the controller of the current element or its parent. By default retrieves controller associated with thengController
directive. Ifname
is provided as camelCase directive name, then the controller for this directive will be retrieved (e.g.'ngModel'
). -
injector()
- retrieves the injector of the current element or its parent. -
scope()
- retrieves the scope of the current element or its parent. Requires Debug Data to be enabled. -
isolateScope()
- retrieves an isolate scope if one is attached directly to the current element. This getter should be used only on elements that contain a directive which starts a new isolate scope. Callingscope()
on this element always returns the original non-isolate scope. Requires Debug Data to be enabled. -
inheritedData()
- same asdata()
, but walks up the DOM until a value is found or the top parent element is reached.
Usage
angular.element(element);
Arguments
Param | Type | Details |
---|---|---|
element | string DOMElement | HTML string or DOMElement to be wrapped into jQuery. |
Returns
Object |
jQuery object. |
© 2010–2017 Google, Inc.
Licensed under the Creative Commons Attribution License 4.0.
https://code.angularjs.org/1.3.20/docs/api/ng/function/angular.element