我可以inheritance父控制器的variables吗?

这是我的代码:

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 } 

我在另一个嵌套一个angular度controller 。 我想将第一个controllervariables传递给第二个controller 。 有谁知道如何做到这一点?

注意

我不能做这样的事情

 ChildCtrl.prototype = new ParentCtrl(); 

因为我会覆盖ChildCtrlpeople属性。

默认情况下,子范围原型从父范围inheritance(请参阅范围 ),因此您已经可以访问子控件中的父控制器的$范围属性。 为了certificate这一点:

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

你错了。 您将控制器inheritance与范围inheritance混合在一起,并且它们在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注意到的那样,这没有任何意义,因为您可以从ParentCtrl和ChildCtrl访问$ scope.people的属性。

如果你想从彼此inheritance控制器,你需要使用控制器函数本身的原型inheritance。

$ scopeinheritance基于你使用ng-controller引用你的控制器的地方。

如果你有类似的东西

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

那么是的,子控制器将inheritance父控制器的属性。

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

你也可以通过DOM获得任何控制器的范围:

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

使用jQuery:

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

或者在文档中获取所有范围:

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

它可能会帮助你!

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

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

范围inheritance范围是控制器特定的。 如果我们定义了嵌套的控制器,那么子控制器将inheritance其父控制器的作用域。

 <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>