Bind ng-repeat to a promise

I am trying to tie a $ resource promise to an ng-repeat. But I cannot get it to work.

Html

<ul ng-controller="ColorsCtrl">
   <li ng-repeat="colors in getColors()"></li>
</ul>

      

Script

app.module("myApp", ['ngResource'])

.factory('Color', function($resource) {
    return $resource('/colors.json');
})

.controller('ColorsCtrl', function($scope, Color) {
    $scope.getColors = function() {
       return Color.query();
    }
});

      

+3


source to share


1 answer


You don't need to bind your interface to a promise: you bind the interface to an array, then you populate the array:

$scope.colors = [];

var colors = Colors.query(function() {
   // fill here $scope.colors
});

      



While an asynchronous request is being processed, you usually display the load block where the data will be displayed.

+3


source







All Articles