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
– Sieabah, Commented Aug 16, 2014 at 8: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
– flup, Commented Aug 16, 2014 at 8: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
– Sieabah, Commented Aug 16, 2014 at 14:44

Community · Accepted Answer · 2017-05-23 12:29:26Z

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, 2017 at 12:29

CommunityBot

11 silver badge

answered Aug 16, 2014 at 8:24

Rabi

2,23019 silver badges18 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Sieabah Over a year ago

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.

Collectives™ on Stack Overflow

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

1 Answer 1

1 Comment

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Linked

Related