ng-controller is to add controllers to the application variables
When there are two controllers, father, child and child are in the father, child can be called a child controller, which will inherit the scope of the parent controller father. child can access all functions and variables in the father scope.
example:
<div ng-controller="father"> <div >name1:{{ name1 }}</div> <div ng-controller="child">name2:{{ name2 }}</div> </div>
Situation 1:
("father",function ($scope) { $scope.name1 = "x"; $scope.name2 = "y"; });
The page displays the results:
name1:x name2:y
Situation 2:
("child",function ($scope) { $scope.name1 = "a"; $scope.name2 = "b"; });
The page displays the results:
name1: name2:b:
Situation 3:
("father",function ($scope) { if($scope.name1){ $scope.name1 += "!"; ($scope.name1); } else { $scope.name1 = "@"; ($scope.name1); } if($scope.name2){ $scope.name2 += "#"; ($scope.name2); } else { $scope.name2 = "$"; ($scope.name2); } ("father"); }); ("child",function ($scope) { if($scope.name1){ $scope.name1 += "%"; ($scope.name1); } else { $scope.name1 = "^"; ($scope.name1); } if($scope.name2){ $scope.name2 += "&"; ($scope.name2); } else { $scope.name2 = "*"; ($scope.name2); } ("child"); });
Console printing results:
@ $ father @% $& child
The page displays the results:
name1:@ name2:$&
It can be seen that the page display result of name1 is inconsistent with the console printing result.
in conclusion:
The parent controller executes first and the child controller executes later. Both the parent and the child controller can access the scope scope under the parent, but when the child controller tries to process data within the parent scope and outside the child scope, the data in the parent may become dirty.
The above detailed explanation of the related attributes based on the ng-controller parent-child nesting in Angular is all the content I share with you. I hope you can give you a reference and I hope you can support me more.