angularJS：如何在父范围内调用子范围函数
如何从父范围调用子范围中定义的方法？
function ParentCntl() { // I want to call the $scope.get here } function ChildCntl($scope) { $scope.get = function() { return "LOL"; } } http://jsfiddle.net/wUPdW/
您可以使用父母给孩子的$broadcast ：
function ParentCntl($scope) { $scope.msg = ""; $scope.get = function(){ $scope.$broadcast ('someEvent'); return $scope.msg; } } function ChildCntl($scope) { $scope.$on('someEvent', function(e) { $scope.$parent.msg = $scope.get(); }); $scope.get = function(){ return "LOL"; } }
工作小提琴： http : //jsfiddle.net/wUPdW/2/
更新 ：还有一个版本，耦合度较低，可testing性较高：
function ParentCntl($scope) { $scope.msg = ""; $scope.get = function(){ $scope.$broadcast ('someEvent'); return $scope.msg; } $scope.$on('pingBack', function(e,data) { $scope.msg = data; }); } function ChildCntl($scope) { $scope.$on('someEvent', function(e) { $scope.$emit("pingBack", $scope.get()); }); $scope.get = function(){ return "LOL"; } }
小提琴： http : //jsfiddle.net/uypo360u/
让我build议另一个解决scheme：
var app = angular.module("myNoteApp", []); app.controller("ParentCntl", function($scope) { $scope.obj = {}; }); app.controller("ChildCntl", function($scope) { $scope.obj.get = function() { return "LOL"; }; });
代码less，使用原型inheritance。
普拉克
孩子初始化时在父母上注册孩子的function。 为了清楚起见，我使用了“as”符号。
模板
<div ng-controller="ParentCntl as p"> <div ng-controller="ChildCntl as c" ng-init="p.init(c.get)"></div> </div>
CONTROLLERS
... function ParentCntl() { var p = this; p.init = function(fnToRegister) { p.childGet = fnToRegister; }; // call p.childGet when you want } function ChildCntl() { var c = this; c.get = function() { return "LOL"; }; }
“但是”，你说，“ ng-init 不应该用这种方式 ！”。 嗯，是的，但是
- 该文件不解释为什么不，和
- 我不相信文档作者会考虑所有可能的用例。
我说这是一个很好的使用它。 如果你想downvote我，请评论的原因！ 🙂
我喜欢这种方法，因为它使组件更加模块化。 唯一的绑定在模板中，并且意味着
- 子控制器不必知道哪些对象添加其function（如在@ canttouchit的答案）
- 父控件可以与任何其他具有get函数的子控件一起使用
- 不需要广播，除非您严格控制事件命名空间，否则这将在大型应用程序中变得非常难看
这种方法更接近Tero关于模块化的指导思想 （注意，在他的模块化的例子中， contestants从父母传递给模板中的“孩子”指令）。
实际上，另一种解决scheme可能是考虑将ChildCntl作为指令来实现，并使用&绑定来注册init方法。
