<!doctype html> <html ng-app="firstApp"> <head> <meta charset="utf-8"> <script src="angular-1.3.0.js"></script> </head> <body> <div ng-controller="parentCtrl"> <input ng-model="args"> <div ng-controller="childCtrl"> <input ng-model="args"> </div> </div> <script> var app=angular.module('firstApp',[]); app.controller('parentCtrl',function($scope) { $scope.args = '123'; }).controller('childCtrl', function($scope) { }); </script>
Fallbeschreibung:
Obwohl in childCtrl kein spezifisches args-Attribut definiert ist, da der Bereich von childCtrl vom Bereich von parentCtrl erbt,
Daher ist childCtrl über den Prototyp mit der Eigenschaft args des übergeordneten Bereichs verknüpft und auf die Eingabe festgelegt. Und der Eingabewert in der übergeordneten Eingabe wird automatisch mit der untergeordneten Eingabe synchronisiert
Aber das Gegenteil ist nicht der Fall. Das heißt, Änderungen im untergeordneten Bereich können den Wert im übergeordneten Bereich nicht ändern, und der untergeordnete Bereich ist auch nach der Änderung des übergeordneten Bereichs nicht mehr synchron. Der Grund: Bei der Eingabe von Inhalten im untergeordneten Bereich
Da das Modell im HTML-Code explizit an den Bereich von childCtrl gebunden ist, generiert AngularJS ein args-Primitivtypattribut für childCtrl.
Gemäß dem AngularJS-Prototypmechanismus zur Bereichsvererbung findet childCtrl den args-Attributwert in seinem eigenen Bereich, sodass es nicht nach dem args-Wert des übergeordneten Elements sucht.
Infolgedessen verfügt der untergeordnete Bereich über Argumente und der übergeordnete Bereich über Argumente, und die Werte zwischen dem untergeordneten und dem übergeordneten Bereich werden nicht mehr synchronisiert.
Das Obige ist der gesamte Inhalt dieses Artikels. Ich hoffe, er gefällt Ihnen allen.