angular.module("myModule.services",[]). factory('messageService',['$window',function(win) { // déclaration du service avec une dépendance à $window function MessageService(win) { var msgs = ["exemple1","exemple2"]; this.addMessage = function(msg) { msgs.push(msg); }; this.getMessages = function() { return msgs; }; this.showMessage = function(msg) { win.alert(msg); }; }; // instanciation du service return new MessageService(win); }]); angular.module("myModule.controllers",[]). controller('mrController',['$scope','messageService',function($scope,msgService) { // creation du controleur avec 2 dépendances $scope et messageService $scope.message = ""; $scope.messages = []; $scope.add = function(msg) { msgService.addMessage(msg); $scope.message = ""; }; $scope.load = function() { $scope.messages = msgService.getMessages(); }; $scope.show = function(msg) { msgService.showMessage(msg); }; }]); // chargement du module principale avec ses modules dépendants angular.module("MyModule",["myModule.services","myModule.controllers"]);
<div ng-app="MyModule"> <div ng-controller="mrController"> <p>Ajouter des messages puis cliquer sur "charger les messages"</p> <input ng-model="message"> <button ng-click="add(message)">ajouter</button> <button ng-click="load()">charger les messages</button> <ul> <li ng-repeat="msg in messages"> <span>{{msg}}</span> <button ng-click="show(msg)">afficher</button> </li> </ul> </div> </div>