web-dev-qa-db-fra.com

AngularJS ng-include: onload appelant une fonction définie dans le contrôleur inclus

En utilisant AngularJS, est-il possible d’utiliser l’argument "onload" pour déclencher une fonction définie dans un contrôleur "enfant" (un contrôleur appelé par le modèle inclus)?

Exemple:

<!-- 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!");
    };  
});

Est-ce que cela a un sens? Ou devrais-je simplement appeler la fonction à l'intérieur du childController, comme ci-dessous?

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

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

    $scope.childOnLoad();   
});
angularjsangularjs-ng-include
7
Matteo Piazza

Laissez le conteneur parent tel que vous l'avez défini:

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

Dans le contrôleur parent, définissez:

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

et dans le contrôleur enfant:

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

Dans votre deuxième tentative, vous avez bien fait: vous créez des fonctions, la portée de ce contrôleur prend ces fonctions en tant que propriétés, puis $ scope.childOnLoad (); appellera la fonction que vous avez créée.

En fait, vous pouvez définir autant de fonctions mais elles ne sont pas appelées lors du chargement ou lorsque les chargements sont terminés.

2
greenfox