Hey! @ Beast, your NG API is out--angular.element

Source: Internet
Author: User

@ The beast's NG API Learning--Angular.element

Wraps a DOM element or an HTML string into a jquery element.

Format: angular.element (Element);

Element: HTML string or DOM element wrapped as a jquery object

Jqlite provides the method:

    • AddClass ()
    • After ()
    • Append ()
    • attr ()
    • Bind () – namespaces, selectors, and event data are not supported
    • Children () – Selector not supported
    • Clone ()
    • Contents ()
    • CSS ()
    • Data ()
    • Empty ()
    • EQ ()
    • Find () – Qualified by label name
    • Hasclass ()
    • HTML ()
    • Next () – Selectors are not supported
    • On () – namespace or selector not supported
    • Off () – namespaces or selectors are not supported
    • One () – namespace or selector not supported
    • Parent () – Selectors are not supported
    • Prepend ()
    • Prop ()
    • Ready ()
    • Remove ()
    • Removeattr ()
    • Removeclass ()
    • Removedata ()
    • ReplaceWith ()
    • Text ()
    • Toggleclass ()
    • Triggerhandler ()-handled by a virtual event object.
    • Unbind () – Namespaces are not supported
    • Val ()
    • Wrap ()

Event:

$destory: When the DOM is removed, Angular intercepts the Jqlite or jquery Dom objects, destroying the APIs and events. This event can be used to clear any dom correlation before the DOM is removed.

Method:

Controller (NAME): Retrieves the controller of the current element or its parent element, by default, retrieves the controller associated with the Ngcontroller, if name is a command name named in hump mode, So this is the Controller for this directive (e.g. ' Ngmodel ').

Injector (): Retrieves the dependency injection of the current element or its parent element.

Scope (): Retrieves the scope of the current element or its parent element.

Isolatescope (): If there is a scope directly attached to the current element, retrieve an isolated scope, which is used only for the element that contains a new isolated scope directive, which calls scope () to always return the original non-isolated scope.

Inheriteddata (): As with data (), but goes along the DOM until the value is found or goes to the top-level DOM element. (thus, it should be the meaning of upward communication.) )

Using code:

<div ng-app= "Demo" >
<div ng-controller= "Testctrl" >
<div id= "mydiv" >hello world!!! </div>
</div>
</div>
<script>
Angular.module ("Demo", [])
. Controller ("Testctrl", ["$scope", function ($scope) {
var element = angular.element ("#myDiv");
Element is an object

The first property is a Div object with ID mydiv;

The second attribute is named content and the value is document;

The third property name is length, the value is 1, the fourth property name is selector, and the value is "#myDiv"
}])
</script>

Well, the translation is all explained, the code used has been written to explain the comments. Next, the beast's understanding of angular.element.

According to the "@ Beast" angular understanding, the controller in the operation of the DOM is to chop hands ... NG has rules for manipulating the DOM using instructions, as we did when we encapsulated some jquery plugins in NG development. Therefore, this method should also be used as much as possible in the instructions.

Angular.element wraps a DOM element or HTML string into a jquery object, and if you refer to jquery before angular, then this is the same as the jquery selector, and you can also use some of the DOM operations of jquery for him; so if you're so willful, Not to cite jquery? Don't worry, Ng comes with jqlite, the above also put Jqlite on this method to package the object to provide some of the methods are listed, there is a need to see OH.

All right, let's get here today. A little tired, slept ...

Hey! @ Beast, your NG API is out--angular.element

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.