list - AngularJS ng-repeat and scope populated within http call results in empty html elements -

i have defined array within scope:

$scope.foo = []; 

i make $http call, , populate variable success event in controller.

in template have unordered list such:

<ul>  <li ng-repeat="i in foo">{{i}}</li> </ul> 

the outcome unordered list has many li elements $scope.foo, contents of empty:

<li ng-repeat="i in foo" class="ng-scope"></li> <li ng-repeat="i in foo" class="ng-scope"></li> <li ng-repeat="i in foo" class="ng-scope"></li> . . . 

i can see array has been populated. furthermore li element count matches array length (as expected), the contents of li empty.

all documentation can find looks populating unordered list. changed jquery call angular $http.post call since problems scoping arise that.

why contents of li elements empty?

if made $scope.foo = []; use foo not range.

example:

<li ng-repeat="i in foo" class="ng-scope">{{i}}</li> <li ng-repeat="i in foo" class="ng-scope" ng-bind="i"></li> 

edited fix mistake, tip.