196 votes

AngularJS. Comment appeler la fonction de contrôleur d’en dehors de l’élément contrôleur

Comment je peux faire appel de la fonction définie en vertu de la manette à partir de n'importe quel endroit de la page web (à l'extérieur du composant contrôleur)?

Il fonctionne parfaitement quand je presse le bouton "get". Mais j'ai besoin de l'appeler à partir de l'extérieur de la div contrôleur. La logique est: par défaut mon div est caché. Quelque part dans le menu de navigation j'appuie sur un bouton et il doit afficher() de mon div et exécuter la fonction de "lecture". Comment je peux faire?

Ma page web est:

<div ng-controller="MyController">
  <input type="text" ng-model="data.firstname" required>
  <input type='text' ng-model="data.lastname" required>

  <form ng-submit="update()"><input type="submit" value="update"></form>
  <form ng-submit="get()"><input type="submit" value="get"></form>
</div>

Mon js:

function MyController($scope) {
  // default data and structure
  $scope.data = {
    "firstname" : "Nicolas",
    "lastname" : "Cage"
  };

  $scope.get = function() {
    $.ajax({
       url: "/php/get_data.php?",
       type: "POST",
       timeout: 10000, // 10 seconds for getting result, otherwise error.
       error:function() { alert("Temporary error. Please try again...");},
       complete: function(){ $.unblockUI();},
       beforeSend: function(){ $.blockUI()},
       success: function(data){
        json_answer = eval('(' + data + ')');
        if (json_answer){
            $scope.$apply(function () {
              $scope.data = json_answer;
        });
        }
    }
});

};

  $scope.update = function() {
$.ajax({
    url: "/php/update_data.php?",
    type: "POST",
    data: $scope.data,
    timeout: 10000, // 10 seconds for getting result, otherwise error.
    error:function() { alert("Temporary error. Please try again...");},
    complete: function(){ $.unblockUI();},
    beforeSend: function(){ $.blockUI()},
    success: function(data){ }
  });
};

}

339voto

Dmitry Mina Points 1067

Voici une façon de contrôleur d'appel de la fonction à partir de l'extérieur de celui-ci: angular.element(document.getElementById('yourControllerElementID')).scope().get();get() est une fonction à partir de votre contrôleur.

vous pouvez basculer document.getElementById('yourControllerElementID') de $('#yourControllerElementID') si vous êtes en utilisant jQuery.

Aussi, si votre fonction implique de changer quoi que ce soit sur votre point de Vue, vous devriez appeler angular.element(document.getElementById('yourControllerElementID')).scope().$apply(); pour appliquer les modifications.

Encore une chose, vous ne devriez noter que les étendues sont initialisés après le chargement de la page, de sorte que l'appel de méthodes à partir de l'extérieur du champ d'application devrait toujours être effectué après le chargement de la page. Sinon, vous n'obtiendrez pas à la portée de tous.

7voto

brOlite Points 328

J’inclurais plutôt l’usine en tant que dépendances sur les contrôleurs qu’injecter avec leur propre ligne de code : http://jsfiddle.net/XqDxG/550/

<strike>ControllerZero. $injecter = [« $scope », « mySharedService »] ;</strike>

5voto

Anton Points 3371

Il peut être intéressant d'examiner si le fait d'avoir votre menu sans aucune portée est la bonne façon de faire. Ce n'est pas vraiment l'angulaire.

Mais, si c'est la façon dont vous devez aller, alors vous pouvez le faire en ajoutant les fonctions $rootScope et puis à l'intérieur de ces fonctions à l'aide de $de diffusion pour envoyer des événements. votre ensuite, le contrôleur utilise $à écouter pour ces événements.

Une autre chose à considérer si vous finissez par avoir votre menu sans lunette, c'est que si vous disposez de plusieurs routes, alors tous vos contrôleurs devront avoir leur propre mettre à jour et obtenir des fonctions. (c'est en supposant que vous avez plusieurs contrôleurs)

4voto

rodrimmb Points 11

J’ai utiliser pour travailler avec $http, quand une envie de m’informer à partir d’une ressource j’ai effectuer les opérations suivantes :

Et le code du contrôleur :

J’ai envoyer au service de quelle fonction dois appeler dans le contrôleur

Prograide.com

Prograide est une communauté de développeurs qui cherche à élargir la connaissance de la programmation au-delà de l'anglais.
Pour cela nous avons les plus grands doutes résolus en français et vous pouvez aussi poser vos propres questions ou résoudre celles des autres.

Powered by:

X