Comment utiliser $ rootScope dans Angular pour stocker des variables?

Comment utiliser $rootScopepour stocker des variables dans un contrôleur auquel je souhaite accéder ultérieurement dans un autre contrôleur? Par exemple:

angular.module('myApp').controller('myCtrl', function($scope) {
  var a = //something in the scope
  //put it in the root scope
});

angular.module('myApp').controller('myCtrl2', function($scope) {
  var b = //get var a from root scope somehow
  //use var b
});

Comment pourrais-je faire ça?

Les variables définies à la portée racine sont disponibles pour la portée du contrôleur via l'héritage prototypique.

Voici une version modifiée de la démo de @ Nitish qui montre la relation un peu plus clairement: http://jsfiddle.net/TmPk5/6/

Notez que la variable de rootScope est définie lors de l'initialisation du module, puis que chaque étendue héritée obtient sa propre copie qui peut être définie indépendamment (la changefonction). De plus, la valeur de rootScope peut également être mise à jour (la changeRsfonction dans myCtrl2)

angular.module('myApp', [])
.run(function($rootScope) {
    $rootScope.test = new Date();
})
.controller('myCtrl', function($scope, $rootScope) {
  $scope.change = function() {
        $scope.test = new Date();
    };

    $scope.getOrig = function() {
        return $rootScope.test;
    };
})
.controller('myCtrl2', function($scope, $rootScope) {
    $scope.change = function() {
        $scope.test = new Date();
    };

    $scope.changeRs = function() {
        $rootScope.test = new Date();
    };

    $scope.getOrig = function() {
        return $rootScope.test;
    };
});

Le partage de données entre les contrôleurs est ce à quoi les usines / services sont très utiles. En bref, cela fonctionne quelque chose comme ça.

var app = angular.module('myApp', []);

app.factory('items', function() {
    var items = [];
    var itemsService = {};

    itemsService.add = function(item) {
        items.push(item);
    };
    itemsService.list = function() {
        return items;
    };

    return itemsService;
});

function Ctrl1($scope,items) {
    $scope.list = items.list; 
}

function Ctrl2($scope, items) {
    $scope.add = items.add;
}

Vous pouvez voir un exemple de travail dans ce violon: http://jsfiddle.net/mbielski/m8saa/

angular.module('myApp').controller('myCtrl', function($scope, $rootScope) {
   var a = //something in the scope
   //put it in the root scope
    $rootScope.test = "TEST";
 });

angular.module('myApp').controller('myCtrl2', function($scope, $rootScope) {
   var b = //get var a from root scope somehow
   //use var b

   $scope.value = $rootScope.test;
   alert($scope.value);

 //    var b = $rootScope.test;
 //  alert(b);
 });

DEMO

je ne trouve aucune raison de faire cela $ scope.value = $ rootScope.test;

$ scope est déjà l'héritage du prototype de $ rootScope.

Veuillez voir cet exemple

var app = angular.module('app',[]).run(function($rootScope){
$rootScope.userName = "Rezaul Hasan";
});

vous pouvez maintenant lier cette variable d'étendue n'importe où dans la balise d'application.

stockez d'abord les valeurs dans $ rootScope sous

.run(function($rootScope){
$rootScope.myData = {name : "nikhil"}
})

.controller('myCtrl', function($scope) {
var a ="Nikhilesh";
$scope.myData.name = a;
});

.controller('myCtrl2', function($scope) {
var b = $scope.myData.name;
)}

$ rootScope est le parent de tous les $ scope, chaque $ scope reçoit une copie des données $ rootScope auxquelles vous pouvez accéder en utilisant $ scope lui-même.

S'il s'agit simplement d'un "accès dans un autre contrôleur", vous pouvez utiliser des constantes angulaires pour cela, l'avantage est; vous pouvez ajouter des paramètres globaux ou d'autres éléments auxquels vous souhaitez accéder tout au long de l'application

app.constant(‘appGlobals’, {
    defaultTemplatePath: '/assets/html/template/',
    appName: 'My Awesome App'
});

puis y accéder comme:

app.controller(‘SomeController’, [‘appGlobals’, function SomeController(config) {
    console.log(appGlobals);
    console.log(‘default path’, appGlobals.defaultTemplatePath);
}]);

(n'a pas testé)

plus d'informations: http://ilikekillnerds.com/2014/11/constants-values-global-variables-in-angularjs-the-right-way/

http://astutejs.blogspot.in/2015/07/angularjs-what-is-rootscope.html

 app.controller('AppCtrl2', function ($scope, $rootScope) {
     $scope.msg = 'SCOPE';
     $rootScope.name = 'ROOT SCOPE';
 });

Il existe plusieurs façons d'y parvenir: -

1. Ajouter $rootScopeà la .runméthode

.run(function ($rootScope) {
    $rootScope.name = "Peter";
});

// Controller
.controller('myController', function ($scope,$rootScope) {
    console.log("Name in rootscope ",$rootScope.name);
    OR
    console.log("Name in scope ",$scope.name);
});

2. Créez un service et accédez-y dans les deux contrôleurs.

.factory('myFactory', function () {
     var object = {};

     object.users = ['John', 'James', 'Jake']; 

     return object;
})
// Controller A

.controller('ControllerA', function (myFactory) {
    console.log("In controller A ", myFactory);
})

// Controller B

.controller('ControllerB', function (myFactory) {
    console.log("In controller B ", myFactory);
})