Как AngularJS разрешает вызов переменных в $scope в 2 или более контроллерах?

Здесь автор упоминает

the $scope object used by the two controllers are not the same $scope object

Фрагмент для этого же:

Теперь рассмотрим небольшую модификацию вышеуказанного кода.

<body ng-app="myapp">
    <div ng-controller="myController1">

        <div>{{data.theVar}}</div>
        <div>{{data.common}}</div>

        <div ng-controller="myController2">
            <div>{{data.theVar}}</div>
            <div>{{data.common}}</div>
            <div>{{temp}}</div>
            <div>{{newTemp}}</div>
        </div>

    </div>
    <script>
        var module = angular.module("myapp", []);
        var myController1 = module.controller("myController1", function($scope) {
            $scope.data = { 
                theVar : "Value One",
                common : "common Value"
            };

            $scope.temp = "John Wick 2 is going to be released soon";
        });

        var myController2 = module.controller("myController2", function($scope) {
            $scope.data = { 
                theVar : "Value Two"
            };

            $scope.newTemp = $scope.temp;
            console.log("");

        });
    </script>
</body>

Вид, соответствующий контроллеру2, был перемещен внутри представления для контроллера1.

Для этой части кода внутри контроллера2,

$scope.newTemp = $scope.temp;

Является ли область $выделена над одним и тем же объектом?

Если да, то как AngularJS это знает?

Если бы они были такими же, $scope.temp в контроллере 2 был бы undefined, и тогда $scope.newTemp?

Для меня это не то же самое, учитывая o/p вышеуказанной программы. См. Ниже:

Но тогда я озадачен тем, почему они оба выходят из одного и того же, когда я отлаживаю,

Как AngularJS может получить доступ к значению $scope.temp от контроллера1 в контроллере2?
Просьба уточнить?

Наконец,

Ответ 1

Хотя это правда, что $scope, используемый в двух контроллерах, не то же самое, они могут наследовать все остальные свойства. Angular $scope похожи на дерево, trunk - это $rootScope и все остальные $scope ветки из этого или другого $scope, так как ваш myController2 является дочерним элементом myController1, вы можете получить доступ к переменные в нем.

$rootScope -> myController1 -> myController2

myController2 может получить доступ ко всем родительским $scope s, myController1 может получить доступ к $rootScope, а $rootScope сможет получить доступ только к себе.

Ответ 2

Для вашей последней части, поскольку оба контроллера имеют свойство по имени data, angular сначала рассмотрит текущую область и затем иерархически переместится, то есть в родительскую область. Поэтому angular обнаруживает data во второй области управления и, следовательно, не нуждается в переменной родительской области data. Но внутри этого свойства нет ключа common и, следовательно, ничего не выводит.

Посмотрите на синтаксис controller as angular, он предназначен для предотвращения этих конфликтов.