Examples of the inheritance relationship between the ng-repeat command and scope of AngularJS, angularjsng-repeat

Source: Internet
Author: User

Examples of the inheritance relationship between the ng-repeat command and scope of AngularJS, angularjsng-repeat

This article analyzes the inheritance relationship between the ng-repeat command of AngularJS and scope. We will share this with you for your reference. The details are as follows:

For the usage of the ng-repeat command, refer to the following code:

<!doctype html>

Note: you do not need to use the {button} syntax to access the button in ng-click. In other non-AngularJS environments, you must use the {button} method. In the ng-repeat command, $ index indicates the index of the retrieved array, starting from 0.

We know that the ng-controller command will create a new scope. The test code is as follows:

<! Doctype html> 

You can use angular. element (domElement). scope () to obtain the scope associated with a DOM element.

<! Doctype html> 

The ng-repeat command creates a new scope and creates a new scope for each dom element in the loop. Through F12 debugging, we can see that scope0 and scope1 are as follows:

We can see that scope0 and scope1 both have a buttons attribute, which is inherited from the parent scope and is similar to the prototype chain of JavaScript.

<!doctype html>

When you click method1, method2, and method3, we want to replace the buttons button1, button2, and button3. Running the code above, we can find that both method2 and method3 can successfully achieve the goal, but method1 cannot. In fact, this is very similar to the issue of transferring values in C language or transferring references.

Var obj = {"name": "aty"}; wrongChangeName (obj); alert (obj. name); // still atyrightChangeName (obj); alert (obj. name); // hehefunction rightChangeName (obj) {obj. name = "hehe";} function wrongChangeName (obj) {obj = {"name": "hehe "};}

WrongChangeName is similar to method1 above, while rightChangeName is similar to method3 above. That is to say, if we want to modify the value of an attribute in parentScope in childsscope, this attribute must not be of the basic javascript data type, but must be of the object type. In addition, you cannot directly change the value by using =. You must call the object method to modify the value.

Related Article

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.