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

Question

De mon point de vue, je tiens à rendre:

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

Où say est définie comme suit:

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

Je peux définir dans mon controller:

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

Mais ensuite, c'est seulement accessible dans le contrôleur.

Si je définir la fonction à l'extérieur de l'angle de la structure de fichiers, il ne rend rien. Même si je définis dans mon controllers.js le fichier, mais en dehors d'une fonction de contrôleur de portée.

Où est le bon endroit pour mettre ma fonction, j'ai donc peut le rendre dans n'importe quel contrôleur?

Answer 1

Une façon est de créer un service avec les fonctions que vous voulez partager à travers de multiples contrôleurs. Voir ce post pour plus d'infos.

Après cela, vous pouvez injecter le service que vous avez créé dans n'importe quel contrôleur et de l'accès à l' say() de la fonction avec le code quelque chose comme ceci:

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

Lorsque vous avez défini myService comme:

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

Voici un jsFiddle avec un exemple.