0

Is it possible to access a $scope variable defined in the $parent's, $parent scope?

E.g.:

var foo = $scope.$parent.$parent.foo; /* evaluates to undefined */

Is this possible, recommended, there a better alternative?

culturalanomoly
  • 1,263
  • 3
  • 17
  • 29
  • [Check out the rootScope](https://docs.angularjs.org/api/ng/service/$rootScope) of angular. On the other hand, if you have the option to get away from this situation, I suggest you do it. – ODelibalta Jul 16 '15 at 19:54
  • ***why the downvote?*** – culturalanomoly Jul 16 '15 at 19:55
  • it *is* possible to do this, but the larger question is, why do you need to? the more that you rely upon using `$parent`, the more spaghetti code you end up with. nested controllers are generally something you should try to avoid whenever possible. Imagine reading someone's code and trying to figure out where `$scope.$parent.$parent.$parent.aproperty` is actually defined. – Claies Jul 16 '15 at 20:01
  • i've inherited an AngularJS project. previous developer thought it'd be a bright idea. re-write may be in order in the future. for now it's "when in rome ... " – culturalanomoly Jul 16 '15 at 20:03
  • 1
    my recommendation in these cases is to start with converting to the ControllerAs Syntax, using a different name for each controller; i.e. `controllerA as ctrlA`, `controllerB as ctrlB`, etc.. Then you can begin to separate the nesting by referring to each property in terms of the controller that it belongs to, i.e. `ctrlA.property`, `ctrlB.property`; you'll likely find a property or two with name collisions, but you'll be able to more easily identify what is going on with each property, and might find the nesting isn't even necessary. – Claies Jul 16 '15 at 20:08
  • they are using ControllerAs, but still referring to `$scope.$parent.$parent`? that doesn't make much sense at all – Claies Jul 16 '15 at 20:09
  • I've seen a lot of code where people use `controllerblah as vm` everywhere, and you have `vm.someproperty` all over the place, and even though it's not relying on `$scope`, it's still far from clear. – Claies Jul 16 '15 at 20:12
  • no, i was trying to use `$scope.$parent.$parent`, not knowing better ... going to utilize the `as ...` now. thanks for the dialog bud, helped ... – culturalanomoly Jul 16 '15 at 20:12
  • 1
    keep in mind, when you use the ControllerAs syntax, the controller becomes a *property* on `$scope`, and thus properties added to the controller can be referenced through `this` in the controller. but what that means is, if you reference the `$scope.$parent`, it might actually be `$scope.$parent.someController.someProperty` that you are trying to reach. – Claies Jul 16 '15 at 20:14
  • i miss the days of writing raw javascript ... – culturalanomoly Jul 16 '15 at 20:18

1 Answers1

1

You should follow dot rule in such cases that will allow you to access the parent scope without having $parent annotation.

If you look at ng-controller API, you will find that the scope: true option which does mean New controller does create a scope which is prototypically inherited from the parent controller, that does allow access to object property which has been already declared in parent scope.

Basically that does follow prototypal inheritance.

Markup

<div ng-controller="myController">
   <h1>my Controller Scope Here</h1>
   <input type="text" ng-model="myCtrl.data"/>
   <div ng-controller="innerController">
      {{myCtrl.data}}: {{innerCtrl}}
   </div>
</div>

Controller

app.controller('myController', function($scope){
    $scope.myCtrl = {};
})

app.controller('innerController', function($scope){
    $scope.innerCtrl = 'inner Data';
})
Community
  • 1
  • 1
Pankaj Parkar
  • 134,766
  • 23
  • 234
  • 299