angular ng-repeat not working as expected

Question

<body ng-app="myApp">
<div  ng-controller="customersCtrl">
   <table>
     <tr ng-repeat="res in customers">
         <td>{{ $index + 1 }}</td>
         <td>{{ res.Name }}</td>
         <td>{{ res.City }}</td>
     </tr>
     </table>
</div>
</body>

  var myApp = angular.module('myApp', []);
   myApp.controller("customersCtrl", function ($scope,$http) {

        $http.post('Default.aspx/Getdata', { data: {} })
             .success(function (response) {
                 $scope.customers = response.d;
             })
            .error(function (data, status, headers, config) {
                alert(status+"-------"+data);
            });
    });

server side function:

 [WebMethod]
public static string Getdata()
{

    List<customors> people = new List<customors>{
               new customors{Name = "biss",City="Lebanon"},
               new customors{Name = "jiji",City="America"}
               };
    JavaScriptSerializer serialiser = new JavaScriptSerializer();

    string json = serialiser.Serialize(people);
    return json; // [{"Name":"biss","City":"Lebanon"},{"Name":"jiji","City":"America"}]

}
public class customors
{
    public string Name{get;set;}
    public string City{get;set;}

}

but No result is being displayed . what i am doing wrong ?

this is not the issue i suppose because as you can see : `.success(function (response) {$scope.customers = response.d;})` — Sora, Aug 19 '15 at 09:32
Is the data being returned correctly? In other words...if you break in the success callback..do you have the correct data? — Bas Slagter, Aug 19 '15 at 09:35
To add to above shouldn't you also be using HTTP get rather than post? — ChrisSwires, Aug 19 '15 at 09:35
yes `responce.d` return `[{"Name":"biss","City":"Lebanon"},{"Name":"jiji","City":"America"}]` — Sora, Aug 19 '15 at 09:35
no if i use `get` instead of `post` the server side function will not be executed anymore — Sora, Aug 19 '15 at 09:36
A GET should also work...if not, your serverside code is also wrong. But to stay on topic: try a $scope.$apply() in your success after setting your $scope property. — Bas Slagter, Aug 19 '15 at 09:38
@MertMertce thank you so much that worked fine my code was missing the JSON.parse function — Sora, Aug 19 '15 at 09:39
@Sora That is not an appropriate resolution to the problem, it's papering over the crack of your server not responding with the correct data. [Get your server-side to use *GET*](http://stackoverflow.com/questions/618900/enable-asp-net-asmx-web-service-for-http-post-get-requests) and [get it to return *JSON*](http://stackoverflow.com/questions/288850/how-to-return-json-from-a-2-0-asmx-web-service), not a string. — CodingIntrigue, Aug 19 '15 at 09:42
you mean i should return my string as a json array and not as a string , thank you i guess i'll work on that in the future . — Sora, Aug 19 '15 at 09:46

score 0 · Accepted Answer · answered Aug 19 '15 at 09:40

Replace your succes function with this:

   .success(function (response) {
             $scope.customers = JSON.parse(response.d);
         })

Your objects are in string format, it will never be able to find .Name if 'Name' is a string. Parsing your response will fix this.

As RGraham stated, this is not ideal. You want to handle this correctly on your server's side.

angular ng-repeat not working as expected

1 Answers1