La première responsabilité du contrôleur est de créer un scope. Ce scope permet d'exposer le modèle à la vue. On pourrait appeler le scope l'élément view-model de l'architecture.
'use strict'; angular.module('myApp').controller('mainCtrl', function($scope) { $scope.model = { name: 'Ceci est un contrôleur', date: '1/1/2014' }; };
Dans le HTML, exemple dans index.html
:
<div ng-controller="mainCtrl"> {{model.name}}<br/> {{model.date}} </div>
Le contrôleur mainCtrl
prendra effet dans le <div>
pour lequel il est déclaré.
Pour se faire, on peut simplement créer un service avec un setter et un getter.
app.factory('shareService', function() { var data; var shareService = { setData: function(input) { data = input; }, getData: function() { return data; } }; return shareService; }
Ensuite, il suffit d'utiliser ce même service dans les contrôleurs dont il est nécessaire de partager les données. On injecte la dépendance du service et on appelle getData()
et setData(data)
lorsque nécessaire.