Accessing AngularJS controller from parent controller via jQuery .each() search

Question

I don't know for sure if this is the correct way to go about calling functions or dealing with child elements, but here is my setup for AngularJS. Also new to stackoverflow sorry if I don't get the formatting correct.

In the angular module:

app.controller('MasterController', function($scope){
    this.Identifier = "Master"; //Here just so I know what scope I was in

    $scope.Initialize = function(){
        console.log("INIT");
        $(".mPanel").each(function(idx,elm){
            console.log(elm);
            console.log(this);
            console.log(angular.element(elm).controller());
            console.log($(this).controller());
            //I want to get the 'panelDir' variable here, or call a function on the client to return it.
            //Is there a better way than trying to hack in a $broadcast?
        });
    }
});

app.controller('PanelController',function($scope){
    this.Identifier = "Panel";
    this.panelDir = null;
});

In HTML file:

/* includes */
<body ng-controller="MasterController" ng-init="Initialize()">

<div class="mPanel" ng-controller="PanelController" ng-init="panelDir='left'">
   <div class="aPanel verticalPanel">
      <div class="tab" ng-click="TogglePane()">
         {- panelDir -}
      </div>
   </div>
</div>

<div class="mPanel" ng-controller="PanelController" ng-init="panelDir='right'">
   <div class="aPanel verticalPanel">
      <div class="tab" ng-click="TogglePane()">
         {- panelDir -}
      </div>
   </div>
</div>

</body>

Explanation:

I want to be able to access the child scope from within the parent so I can call a function on it or return a value so the parent. I'm open to suggestions on how to fix this.

Edit: More info about what I want to happen

When the page loads the ng-init calls Initialize on the MasterController, which (in this instance) tries to find all the divs of class mPanel and figure out the scope of that element. It should return, at least I think it should, PanelController, but always says the scope is the MasterController.

How do I get the correct scope for PanelController?

Edit: Plunk added http://plnkr.co/edit/JsVtlxtiee1NvlUIUcK2

@Rabi TogglePane() isn't defined yet as it isn't what I'm trying to work out. When the page loads the ng-init calls Initialize on the MasterController, which (in this instance) tries to find all the divs of class mPanel and figure out the scope of that element. It should return, at least I think it should, PanelController, but always says the scope is the MasterController. — Sieabah, Aug 16 '14 at 08:02
write down what functionality you're looking for, cause it'll probably be implemented by listening to changing scopes rather than looking up controllers. — flup, Aug 16 '14 at 08:47
@flup I want to make sure on Initialize() certain things are called in a certain order because parts of the page rely on other parts being completed before being called. I'd prefer a method to call functions on other scopes rather then rely on broadcasts being called in a certain order, unless of course broadcasts are certain to be called in order. — Sieabah, Aug 16 '14 at 14:44
I'm remaking an app that requires the layers be in the correct place before the rest of the code is executed. I haven't yet programmed that part because I'm new to AngularJS and this is the one thing in the way currently. I just need a way to sequentially call functions, if broadcast has the possibility of calling functions out of order then I can't use that solution. — Sieabah, Aug 16 '14 at 22:30
Bit unsure what you mean by layers. Can you perhaps instantiate these layers as services? The injector can be taught what depends on what and will create the services in the right order. — flup, Aug 16 '14 at 22:34
The layers or 'panels' are for UI interaction, I'm trying to call a setup function on them so when the master controller tells them to start they will go off and do their respective things. Later in the Initialize() function I want to call other controllers to set themselves up, but I need this done in a sequential order. — Sieabah, Aug 16 '14 at 22:44

score 0 · Answer 1 · edited May 23 '17 at 12:29

0

first of all, you should never do DOM manipulation in controller . better use $scope, since $scope is the glue between view and controller.

coming back to you question - you can look at my earlier posts, similar to your question - Angular Js newbie - link in a controller view that triggers another controller action and Angularjs how to access scope data from outside

edited May 23 '17 at 12:29

Community

1
1

answered Aug 16 '14 at 08:24

Rabi

2,210
17
18

Anyway to be certain that things are called in a specific order with broadcasts? I see one of your links talks about emitting from child to parent, I strictly need parent to child communication. – Sieabah Aug 16 '14 at 14:56

Accessing AngularJS controller from parent controller via jQuery .each() search

1 Answers1