0

I have a template which is served by 2 controllers. The parent controller is coming from a configuration in ui-router. The child controller is in the same template file but using ng-controller like <div ng-controller="ChildCtrl">.

On the parent controller, I used $scope.model object. I'm accessing $scope.model from the child controller using $scope.model and it's working great. However, my team mate is complaining that it's hard to troubleshoot. He was wondering where $scope.model was coming from. What are some better solutions?

Sunil D.
  • 17,983
  • 6
  • 53
  • 65
devwannabe
  • 3,160
  • 8
  • 42
  • 79
  • 4
    use the controllerAs syntax if possible. There are plenty of articles on the web about controllerAs, and quite a few answers to questions here as well, including a few I've written; for example http://stackoverflow.com/a/30644370/2495283 – Claies Aug 03 '15 at 17:14
  • I've been reading Todd Moto and John Papa's controllerAs for few days. Someone asked there how to access the parent scope from inside the controller but not from the template, nobody answered. That's why I'm a bit not sure about controllerAs. – devwannabe Aug 03 '15 at 17:23
  • accessing the "parent" controller in ControllerAs is actually straightforward, since using ControllerAs you reference the controllers as objects, not their inheritance tree, you just refer to them by their variable name. The problem comes in when people name every one of their controllers the same, i.e. `ng-controller="MyController as vm"`, where every controller is `vm` and reference by name isn't possible. That's a different discussion, however.... – Claies Aug 03 '15 at 17:27
  • however, ControllerAs doesn't **remove** `$scope`, as I mentioned in my referenced answer; if you really had to, you could use `$parent` and access a higher tier of the `$scope` chain directly; My though on this, though, is that with proper planning, this shouldn't be necessary. – Claies Aug 03 '15 at 17:30
  • Yup, I'm aware and I'll be using it like, CustomerVM, ProfileVM, etc. I'll look for examples. Thanks! – devwannabe Aug 03 '15 at 17:31
  • so I got the controllerAs working in the template but not when it's inside the child controller. How do I access for example ProfileVM.name in the child controller? The error is ProfileVM is not defined when child controller is instantiated. – devwannabe Aug 03 '15 at 18:00
  • so you are trying to access a value from the parent controller inside the child controller (not in the HTML)? I would suggest writing a new question (since this one was closed, maybe due to misunderstanding the problem), and in your new question, show some code demonstrating the variables you are trying to access, and possibly also why you need this nesting. – Claies Aug 03 '15 at 18:46
  • more than likely, if you have a property that is being shared by multiple controllers, you should have a service hold the value, but without seeing what it is you are trying to accomplish, it's hard to say. In general, however, a controller should directly support the HTML it's wrapping, and should be self contained, able to function if it were the only element on the page. – Claies Aug 03 '15 at 18:50
  • Yeah, looks like with the ControllerAs approach, a service has to be created now unlike previously, I just access the parent model from child controller like this - console.log('parent model', $scope.model.name); But of course, I should reinitialize scope.model inside child controller or else, the data I entered will be gone. – devwannabe Aug 03 '15 at 21:05

0 Answers0