How to call a sibling scope in angular js using rootscope

Question

Here is my app.js

  var app = angular.module("app",[]);
  app.controller("myFirstController",['$scope',function($scope){
    $scope.test = "myfirstName";
    $scope.test1 = "myfirstName";
  }])

  app.controller("mySecondController",['$scope','$rootScope',function($scope,$rootScope){
    $scope.test = "myLastName";
    //Here how to call my test,test1 scope using $rootScope ?? 
  }])

Can i do this using $rootScope?I dont want to use any emit and broadcast or this

Inspect scope hierarchy, it's trivial to figure out how to do it. However, you should not do it, it's bad approach to access data like this. — dfsq, Dec 16 '16 at 07:47
Ya i checked my hirerarchy i am not seeing any my test and test1 variable... Ya ohk even though its a bad practise is it possible??? — Parshuram Kalvikatte, Dec 16 '16 at 07:48
Controller should not even try to access data outside of its scope. If you don't care about app being low quality mess which hard to maintain then what you are trying to do it fine. — dfsq, Dec 16 '16 at 07:51
Use a service that's injected into both controllers. Services and factories are singletons. — Phix, Dec 16 '16 at 07:55
Possible duplicate of [AngularJS: How can I pass variables between controllers?](http://stackoverflow.com/questions/12008908/angularjs-how-can-i-pass-variables-between-controllers) — Ramesh Rajendran, Dec 16 '16 at 08:06
The best approach to do this **is not** with `$rootScope`. Are you sure you want to use it? — Mistalis, Dec 16 '16 at 11:05

score 0 · Accepted Answer · edited May 23 '17 at 12:30

0

if you store any value in rootscope like :

$rootScope.test =" value ";

and you can retrieve value from the rootScope like

var value = $rootScope.test;

But it's not good to use for data maintenance and security

because if you refresh browser, then all scope values are cleared.

So I will suggest you for 3 varies ways

I dont want to use any emit and broadcast or

But that's the only way is best to pass value from one controller to another controller

edited May 23 '17 at 12:30

Community

1
1

answered Dec 16 '16 at 07:48

Ramesh Rajendran

37,412
45
153
234

Worst practice approach possible. – dfsq Dec 16 '16 at 07:52
@dfsq . Please read my full answer. and thanks for your comments :+1 – Ramesh Rajendran Dec 16 '16 at 07:57
1

Not only you are answering something else (it has nothing to do with data persistence, so storage, cookie is irrelevant) but you (as well as other answer) promote super low-quality design. You have controller what manages its state/data (`$scope`). Then all of a sudden this data gets changes by ... who know what (another controller). You see the problem here? That's why you should never mess with global values (`$rootScope`). – dfsq Dec 16 '16 at 08:00
@dfsq . We never did it like angular.copy(), we just use `=` assignment with the rootScope. So it's not affect. – Ramesh Rajendran Dec 16 '16 at 08:03
1

Did you read what I wrote? I explained why what you posted is really-really bad. How is it about `angular.copy`.. Whatever. – dfsq Dec 16 '16 at 09:14

score -1 · Answer 2 · answered Dec 16 '16 at 07:48

you can do like below but use different names for avoiding errors in some cases.if you doesn't declare it as $rootScope in first ctrl then it will be undef in second ctrl

<!DOCTYPE html>
<html ng-app="plunker">

  <head>
    <meta charset="utf-8" />
    <title>AngularJS Plunker</title>
    <script>document.write('<base href="' + document.location + '" />');</script>
    <link rel="stylesheet" href="style.css" />
    <script data-require="angular.js@1.4.x" src="https://code.angularjs.org/1.4.12/angular.js" data-semver="1.4.9"></script>
    <script src="app.js"></script>
  </head>

  <body >
    <div ng-controller="myFirstController">
    
    </div>
    <div ng-controller="mySecondController">
    
    </div>
  </body>
<script>
  var app = angular.module('plunker', []);

 app.controller("myFirstController",['$scope','$rootScope',function($scope,$rootScope){
    $rootScope.test = "myfirstName";
  }])

  app.controller("mySecondController",['$scope','$rootScope',function($scope,$rootScope){
    $scope.test = "myLastName";
    console.log($rootScope.test);
    //Here how to call my myFirstName scope using $rootScope ?? 
  }])
</script>
</html>

why my $rootScope.test giving 'myLastName' ? in my rootscope there are two variable test i think? whats going on because $rootScope.test = "myfirstName"; and $scope.test = "myLastName"; are both child of my rootscope?? — Parshuram Kalvikatte, Dec 16 '16 at 07:56
if you try like i said you wont get lastname....can u show how your trying — Sa E Chowdary, Dec 16 '16 at 08:05

How to call a sibling scope in angular js using rootscope

2 Answers2