在AngularJS中使用嵌套控制器时，是否在所有控制器中共享$ scope对象

AngularJS中可以嵌套控制器吗？在嵌套控制器的情况下，$ scope对象是否在所有控制器之间共享。

的问题是： -

我可以访问横跨所有控制器的第一控制器$范围值，但我不能让第三控制器中的第二控制器范围的对象。你可以在下面的代码片段中运行并检查它。

var app = angular.module("appTest",[]); 
 

 

 
    function Controller1($scope) { 
 
     $scope.text1= "text Sample 1" 
 
    } 
 

 
    function Controller2($scope) { 
 
     $scope.text2= "text sample 2" 
 
    } 
 
    
 
    function Controller3($scope) { 
 
     $scope.text3 = $scope.text1 + " And " + $scope.text2; 
 
    } 
 

 
    app.controller("Controller1",Controller1); 
 
    app.controller("Controller2",Controller2); 
 
    app.controller("Controller3",Controller3);

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 
<body ng-app="appTest"> 
 
    <div ng-controller="Controller1"> 
 
     <div> 
 
     <h1> First Controller</h1> 
 
     First Controller Values is <b> {{text1}}</b> 
 
     </div> 
 
     <div ng-controller="Controller2"> 
 
     <h1> Second Controller</h1> 
 
     First Controller Values is <b> {{text1}}</b> 
 
     <br /> 
 
     Second controller value is <b> {{text2}}</b> 
 
     </div> 
 
     <div ng-controller="Controller3"> 
 
     <h1> Thired Controller</h1> 
 
     First Controller Values + Second controller value is <b> {{text3}}</b> 
 
     
 
     </div> 
 
    </div> 
 
    </body>

来源

2017-08-31 Ramesh Rajendran

https://github.com/angular/angular.js/wiki/Understanding-Scopes#user-content-ng-controller –

是的，你可以在angularjs嵌套控制器。父控制器范围将沿原型链继承，所有子控制器都将访问父范围。

但我无法获得第三个控制器中的第二个控制器作用域对象。

原因是你的第三个控制器是独立于你的第二个控制器。您不能直接从另一个独立控制器访问$scope属性。您可以将第三个控制器嵌套在第二个控制器中，或者使用服务共享数据（后者更受欢迎）。

var app = angular.module("appTest",[]); 
 

 

 
    function Controller1($scope) { 
 
     $scope.text1= "text Sample 1" 
 
    } 
 

 
    function Controller2($scope) { 
 
     $scope.text2= "text sample 2" 
 
     $scope.text1="text Sample 1 from controller 2";//this will be printed in controller 2 and if you want to access parent data, use $parent 
 
    } 
 
    
 
    function Controller3($scope) { 
 
     $scope.text3 = $scope.text1 + " And " + $scope.text2; 
 
    } 
 

 
    app.controller("Controller1",Controller1); 
 
    app.controller("Controller2",Controller2); 
 
    app.controller("Controller3",Controller3);

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 

 
<body ng-app="appTest"> 
 
    <div ng-controller="Controller1"> 
 
     <div> 
 
      <h1> First Controller</h1> First Controller Values is <b> {{text1}}</b> </div> 
 
     <div ng-controller="Controller2"> 
 
      <h1> Second Controller</h1> First Controller Values is <b> {{$parent.text1}}</b> 
 
      First Controller's scope objects value in scond controller <b> {{text1}}</b> 
 
      <br /> Second controller value is <b> {{text2}}</b> 
 
      <div ng-controller="Controller3"> 
 
       <h1> Thired Controller</h1> First Controller Values + Second controller value is <b> {{text3}}</b> </div> 
 
     </div> 
 
    </div> 
 
</body>

来源

2017-08-31 10:02:19 Vivz

在AngularJS中使用嵌套控制器时，是否在所有控制器中共享$ scope对象

回答

相关问题