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
