¡Esta es una revisión vieja del documento!
El $rootScope
es el scope
del que heredan el resto de los scopes que usamos en los controladores 1). Su utilidad es como variable global ya que nos permite añadir propiedades a él y que el resto de controladores tengan acceso.
Al ser como una variable global hay que usarlo con cuidado y en general si tenemos algún dato global es mejor usar un servicio para guardar dicho dato que usar el $rootScope
.
Sin embargo el $rootScope
tiene una ventana sobre un servicio. Usando un servicio nos obliga en todos los scope
que necesitemos el tener que inyectarlo y guardarnos sus datos. Es decir que hay que repetir ese pequeño trozo de código en todos los controladores. Sin embargo , usando $rootScope
mas un servicio podemos tener lo mejor de ambos mundos.
Veamos ahora un ejemplo esto.En este ejemplo vamos a suponer que todos los controladores necesitan de la propiedad appName
con el nombre de la aplicación para poder mostrarla en la página.
El códigi JavaScript de los controladores quedaría así:
app.controller("ControllerA",["$scope",function($scope) { $scope.appName="Gestión de seguros médicos" }]); app.controller("ControllerB",["$scope",function($scope) { $scope.appName="Gestión de seguros médicos" }]);
Vemos como tenemos 2 controladores (“ControllerA” y “ControllerB”), en ambos casos definimos la misma propiedad en el $scope
llamada appName
. Nos podríamos ahorrar las 2 líneas (o muchas mas si hubiera mas controladores) usando $rootScope
y definiendo la propiedad appName
en él.
Para definir una única vez la propiedad y fuera los controladores se usan un bloque run.
app.run(['$rootScope',function($rootScope) { $rootScope.appName="Gestión de seguros médicos"; }]); app.controller("ControllerA",["$scope",function($scope) { }]); app.controller("ControllerB",["$scope",function($scope) { }]);
appName
.appName
en cada controlador.Pero como ya hemos dicho está un poco mal tener valor que sean constantes directamente en bloques run o bloques config. Así que vamos a crear un value para guardar el valor.
app.value("appName",""Gestión de seguros médicos""); app.run(['$rootScope','appName',function($rootScope,appName) { $rootScope.appName=appName; }]); app.controller("ControllerA",["$scope",function($scope) { }]); app.controller("ControllerB",["$scope",function($scope) { }]);
value
con el valor de appName
.appName
en el bloque run.appName
.
Este último cambio parece un poco tonto ya que hemos movido el valor del bloque run al value. Realmente es necesario ya que de esa forma podremos usar el valor de
appName'' en otros sitios además del bloque run.