AngularJS ng-include：onload调用包含控制器中定义的函数答案

【问题标题】：AngularJS ng-include: onload calling a function defined in included controllerAngularJS ng-include：onload调用包含控制器中定义的函数
【发布时间】：2014-05-06 06:51:57
【问题描述】：

使用 AngularJS，是否可以使用“onload”参数来触发在“子”控制器（由包含的模板调用的控制器）中定义的函数？

例子：

<!-- parent container -->
<div ng-include="'/path/template.html'" onload="childOnLoad()"></div>

<!-- template.html -->
<div ng-controller="childController">   
    <p ng-bind="txt"></p>
</div>

<!-- childController.js -->
app.controller('childController', function($scope) {    
    $scope.txt = "Test text";

    $scope.childOnLoad = function() {
        alert("Loaded!");
    };  
});

这有意义吗？还是我应该简单地调用 childController 中的函数，如下所示？

<!-- childController.js -->
app.controller('childController', function($scope) {    
    $scope.txt = "Test text";

    $scope.childOnLoad = function() {
        alert("Loaded!");
    };

    $scope.childOnLoad();   
});

【问题讨论】：

看看stackoverflow.com/questions/15458609/…
那么...你建议在子控制器中简单地调用 $scope.childOnLoad() 吗？
是的，我只想在控制器内部调用$scope.childOnLoad() 函数。直到 Angular 添加另一个专门针对 onload 事件的指令。
我想提的另一件事是，如果您的 childOnLoad 函数类似地初始化变量，您最好将其完全删除并直接在主体中初始化。

标签： angularjs angularjs-ng-include

【解决方案1】：

按照您定义的方式保留父容器：

<div ng-include="'/path/template.html'" onload="childOnLoad()"></div>

在父控制器中定义：

$scope.childOnLoad() {
  $scope.$broadcast("childOnLoad", data);
}

在子控制器中：

$scope.$on("childOnLoad", function (event, data) {
  alert("Loaded!");
});

【讨论】：

【解决方案2】：

在您的第二次尝试中，您做对了：您正在创建一些函数，该控制器的范围将这些函数作为属性，然后是 $scope.childOnLoad();将调用您创建的函数。

事实上你可以定义这么多的函数，但是它们不会在加载或加载完成时被调用。

【讨论】：