Friday, February 13, 2015

Using ng-repeat to Process JSON response from the server Ajax calls

In the previous posts we saw on how to use the ng-repeat directive to handle 1-dimentional arrays and arrays of objects.

ng-repeat directive
Using ng-repeat to process an array of objects

In this post we shall see a more real time scenario of using ng-repeat directive to process JSON data which is received from a server side API call. The following example does an API call using the $http services to get a JSON response containing a list of report details, the view iterates through the reports in the JSON and displays the report id and name in the HTML view

Ajax call
            .then(function (results) {
                try {
                    scope. reports =;
                catch (err) {
            }, function (results) {
                alert("Error: " + + "; "
                                      + results.status);

UI to Process JSON
<ul ng-repeat="report in reports">
    <li>{{report.Name}} - {{report.Name}}</li>

Search Flipkart Products:

No comments: