Question

这是我的代码：

function ParentCtrl($scope) {
$scope.people = ["Tom", "Dick", "Harry"];
$scope.count = $scope.people.length;
}

function ChildCtrl($scope) {
$scope.parentpeople = ParentCtrl.people //this is what I would like to do ideally
}

我在另一个内嵌一个角controller。我想将第一个controller的变量传递给第二个ChildCtrl.prototype = new ParentCtrl();。有谁知道怎么做？

注意

我不能做像

这样的事情

people

因为我会覆盖ChildCtrl的{{1}}属性。

Answer 1

默认情况下，子范围原型继承父范围（请参阅Scope），因此您已经可以访问子控件中父控制器的$ scope属性。为了证明这一点：

function ChildCtrl($scope) {
    alert($scope.people)
}

Answer 2

你弄错了。您正在将控制器继承与范围继承混合在一起，它们在AngularJS中是不同的并且松散耦合。

你真正想要的是：

function ParentCtrl($scope) {
    $scope.people = ["Tom", "Dick", "Harry"];
    $scope.count = $scope.people.length;
}

function ChildCtrl($scope) {
    $scope.parentpeople = $scope.$parent.people;
}

它适用于案例：

<div ng-controller="ParentCtrl">
    <div ng-controller="ChildCtrl">
    </div>
</div>

但正如Mark和ganaraj上面所说，这没有任何意义，因为你可以从两个访问$ scope.people的属性 ParentCtrl和ChildCtrl。

如果要相互继承控制器，则需要使用控制器函数本身的原型继承。

Answer 3

$ scope继承基于使用ng-controller引用控制器的位置。

如果您有类似

的内容

<div ng-controller="ParentController">
    <div ng-controller="ChildController">
    </div>
</div>

然后是的，子控制器将继承父控制器的属性。

注意：不需要在html中的直接子节点上定义子控制器。它可以是任何孩子。

Answer 4

您也可以通过DOM获取任何控制器的范围：

$needleScope = angular.element(aDomElement).scope()

使用jQuery：

$needleScope = $('#aDomElementId').scope()

或者获取文档中的所有范围：

$allScopes = $('.ng-scope').scope()

Answer 5

它可能对你有帮助!!!

Scope是一个特殊的JavaScript对象，它将控制器与视图连接起来。范围包含模型数据。在控制器中，模型数据通过$ scope对象访问。

<script>
      var mainApp = angular.module("mainApp", []);

      mainApp.controller("shapeController", function($scope) {
         $scope.message = "In shape controller";
         $scope.type = "Shape";
      });
</script>

范围继承范围是特定于控制器的。如果我们定义嵌套控制器，那么子控制器将继承其父控制器的范围。

<script>
      var mainApp = angular.module("mainApp", []);

      mainApp.controller("shapeController", function($scope) {
         $scope.message = "In shape controller";
         $scope.type = "Shape";
      });

      mainApp.controller("circleController", function($scope) {
         $scope.message = "In circle controller";   
      });
</script>

实例如下。

<html>
    <head>
       <title>Angular JS Forms</title>
    </head>
    <body>
       <h2>AngularJS Sample Application</h2>
       <div ng-app="mainApp" ng-controller="shapeController">
          <p>{{message}} <br/> {{type}} </p>
          <div ng-controller="circleController">
             <p>{{message}} <br/> {{type}} </p>
          </div>
          <div ng-controller="squareController">
             <p>{{message}} <br/> {{type}} </p>
          </div>
       </div>
       <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.2.15/angular.min.js"></script>
       <script>
          var mainApp = angular.module("mainApp", []);

          mainApp.controller("shapeController", function($scope) {
             $scope.message = "In shape controller";
             $scope.type = "Shape";
          });

          mainApp.controller("circleController", function($scope) {
             $scope.message = "In circle controller";   
          });

          mainApp.controller("squareController", function($scope) {
             $scope.message = "In square controller";
             $scope.type = "Square";
          });

       </script>
    </body>
    </html>

我可以继承父控制器的变量吗？

5 个答案: