Où placer les fonctions définies par l'utilisateur dans Angular JS?

Question

À mon avis, je veux rendre:

<p> 
    {{ say() }} 
</p> 

Où say est défini comme tel:

say = function() { 
    return "Hello World"; 
} 

Je peux définir dans mon contrôleur:

function TestCtrl($scope) { 
    $scope.say = function() { ... }; 
} 

Mais il est uniquement accessible dans ce contrôleur.

Si je définis la fonction en dehors de la structure de fichier Angular, il ne restitue rien. Idem si je le définis dans mon fichier controllers.js, mais en dehors d'une portée de fonction de contrôleur.

Où est l'endroit approprié pour mettre ma fonction, donc je peux le rendre dans n'importe quel contrôleur?

Answer 1

Une façon est de create a service avec les fonctions que vous souhaitez partager entre plusieurs contrôleurs. Voir this post pour plus d'informations.

Une fois que vous le faites, vous pouvez injecter le service que vous avez créé dans un contrôleur et d'accéder à la fonction say() avec le code comme ceci:

function TestCtrl($scope, myService){ 
    $scope.say = myService.say; 
} 

où vous avez défini myService comme:

angular.module('myApp', []) 
    .factory('myService', function() { 
     return { 
      say: function() { 
       return "Hello World"; 
      } 
     } 
    }); 

ici est un jsFiddle avec un exemple.