I am attempting to utilize a nested controller within an ng-repeat in order to have the accordion panels on the page function in different scopes. However, I am encountering a problem where the code inside the nested controller is not being executed. I placed a "debugger" stop point at the beginning of the code but it never gets triggered.
Below is the HTML snippet:
<script src="~/Scripts/app/LWS/LWSCtrl.js"></script>
<script src="~/Scripts/app/LWS/lwsService.js"></script>
<script src="~/Scripts/app/Common/commonCtrl.js"></script>
<script src="~/Scripts/app/Common/commonService.js"></script>
<div ng-app-="myModule" ng-controller="LWSCtrl">
<div cg-busy="waitopr"></div>
<tabset>
<tab heading="Dashboard">
<div ng-repeat="m in majors">
<div ng-controller="commonCtrl">
<accordion close-others="oneAtATime">
<accordion-group is-open="status.open">
<accordion-heading>
<div style="height:20px">
<span class="pull-left">{{m.MajorName}}</span><i class="pull-right glyphicon" ng-class="{'glyphicon-chevron-up': status.open, 'glyphicon-chevron-down': !status.open}"></i>
</div>
</accordion-heading>
...(shortened for brevity)
Here is the complete nested controller code:
angular.module('myModule').controller('commonCtrl', function ($scope, commonService, $, $timeout, $filter, $interval, $window) {
debugger;
$scope.oneAtATime = true;
$scope.status = {
isFirstOpen: false,
isFirstDisabled: false
};
getDashboard();
function getDashboard() {
$scope.waitopr = commonService.getlwsdashboard()
.success(function (data) {
$scope.dashboard = data;
var arr = {};
for (var i = 0, len = $scope.dashboard.length; i < len; i++) {
arr[$scope.dashboard[i]['CompanyID']] = $scope.dashboard[i];
};
$scope.majors = new Array();
for (var key in arr) {
$scope.majors.push(arr[key]);
}
angular.forEach($scope.majors, function (value, key) {
for (var i = 0; i < $scope.dashboard.length; i++) {
if (value.CompanyID == $scope.dashboard[i].CompanyID) {
$scope.majors[key].header = $scope.dashboard[i];
};
}
})
angular.forEach($scope.majors, function (value, key) {
$scope.waitopr = commonService.getlegend(value.CompanyID)
.success(function (data) {
$scope.majors[key].Legend = data;
for (var i = 0; i < $scope.dashboard.length; i++) {
if (value.CompanyID == $scope.dashboard[i].CompanyID) {
$scope.majors[key].MajorName = $scope.dashboard[i].MajorName;
};
}
});//end success
});//end forEach
angular.forEach($scope.majors, function (value, key) {
for (var i = 0; i < $scope.dashboard.length; i++) {
if (value.CompanyID == $scope.dashboard[i].CompanyID) {
items.push($scope.dashboard[i]);
};
}
$scope.majors[key].items = items;
items = [];
})
});//end success
};
I am puzzled as to why the nested controller code isn't running. Any help would be greatly appreciated!