angular.js - How does the angular.element method get the scope of the DOM element?

Question

The parent page a.html has a controller, and then uses the include function to load b.html in.
There is a child controller nested inside the parent controller.
Then I found that the element.scope method can only get the scope of the main controller and cannot return the scope where the element is located.
Ask the master how to solve it.

a.html

<script src="app.js" type="text/javascript"></script>
<p ng-controller="a">
    <p ng-include="b.html"></p>
</p>

app.js

var app = angular.module('App',[]);
//主模块
app.controller("a", function($scope) {
    $scope.name= "a_name";
});
//子模块
app.controller("b", function($scope) {
    $scope.name= "b_name";
});

b.html

<script>
    var $scope = angular.element("#c").scope();
    console.log($scope.name);//理论上应该返回b_name，实际返回a_name
</script>
<p ng-controller="b">
    <p id="c"></p>
</p>

Answer 1

In fact, what you get is the parent scope. You want to get the name. In fact, you only need to distinguish the attribute values ​​f_name and c_name in the parent and child controllers