What does the actual generated HTML for the ng-repeat elements show (e.g. is it generating multiple li elements? )
>I have $scope.accountPeriods and an ng-repeat "p in accountPeriods" in the html which works perfectly with a return list from the database.
>
>
><li class="dropdown" dropdown ng-show="environments" >
> <a href="#" class="dropdown-toggle" dropdown-toggle>
> {{(environment.value) || "Select an environment"}} <b class="caret"></b>
> </a>
>
> <ul class="dropdown-menu arc-dropdown" ng-init="ppage=0">
> <li ng-repeat="e in environments|skipTake:ppage*10:10">
> <a ng-click="selectEnvironment(e)">{{e.value}}</a>
> </li>
> <li class="tempnavigation">
> <ul>
> <li>
> <a ng-click="navigate(ppage=(ppage-1)>0?ppage-1:0,$event)">
> <span class="glyphicon glyphicon-chevron-left"></span>
> </a>
> </li>
> <li>
> <a ng-click="navigate(ppage=(((ppage+1)*10>=environments.length)?ppage:ppage+1), $event)">
> <span class="glyphicon glyphicon-chevron-right"></span>
> </a>
> </li>
> </ul>
> </li>
> </ul>
></li>
>{{accountPeriods}}
><li class="dropdown" dropdown ng-show="accountPeriods">
> <a href="#" class="dropdown-toggle" dropdown-toggle>
> {{(accountPeriod.value) || "Select an accountPeriod"}} <b class="caret"></b>
> </a>
>
> <ul class="dropdown-menu arc-dropdown" ng-init="ppage=0">
> <li ng-repeat="a in accountPeriods|skipTake:ppage*10:10">
> <a ng-click="selectAccountPeriod(a)">{{a.value}}</a>
> </li>
> <li class="tempnavigation">
> <ul>
> <li><a ng-click="navigate(ppage=(ppage-1)>0?ppage-1:0,$event)"><span class="glyphicon glyphicon-chevron-left"></span> </a></li>
> <li>
> <a ng-click="navigate(ppage=(((ppage+1)*10>=accountPeriods.length)?ppage:ppage+1), $event)">
> <span class=" glyphicon glyphicon-chevron-right">
> </span>
> </a>
> </li>
> </ul>
> </li>
> </ul>
></li>
>
>>
>These values are populated in a call to a service:
>
>
> function arcBreadcrumbService($http, $q, arcEnvironmentService, arcAccountPeriodService) {
> var n = $q.defer();
> var o;
> var environments = arcEnvironmentService.all();
> var accountPeriods = []; //arcAccountPeriodService.all();
> var setNames = function (obj) {
> o = obj;
> if (o.environments && o.accountPeriods) {
> n.resolve(o);
> }
> };
>>
>Which yields what is show in the attachment.
>
>When I select an environment, I want to get a new list of account periods for said environment.
>
>
>so this code fires:
>
>
> $scope.selectEnvironment = function (p) {
> accountPeriodFactory.getlist(p.id).then(function (data) {
> $scope.accountPeriods = data;
> });
>
> var name = $rootScope.$state.current.name;
> $rootScope.$state.go(name, {
> environment: p.id
> });
>
>
> return false;
> };
>
>>
>The problem is that data in the above example contains an [object(Array)] containg an array of accountperiods for the correct environment. $scope.accountPeriods is then set to data, on upon inspection shows the requisite data array.
>
>When $scope.accountPeriods is changed, the accountPeriods in the html still contains the empty list we set it to in the service. We place {{accountPeriods}} in the html and it display nothing as shown in the attached png. {{environments}} on the same html display a ton of environments. Both environments and accoutPeriods are on $scope.
>
>Any ideas on how to make this be seen in the html? We've tried $.scope.$apply (error- digest is already running) and about 20 other solutions from stack overflow, all to no avail.
>
>Thanks in advance.
