title: Consuming JSON ASMX Web Services with AngularJS
body: <p>I have a problem, I need to display the data of my database on a table, but I can not.
  I have a webservice that is displaying data from my database in Json, but when I try to display on a table with angular, it does not load.</p>
  
  <p><a href="http://i.stack.imgur.com/Y1ZEi.png" rel="nofollow">enter image description here</a></p>
  
  <pre><code>&lt;!DOCTYPE html&gt;
  &lt;html xmlns="http://www.w3.org/1999/xhtml" &gt;
  &lt;head&gt;
      &lt;title&gt;&lt;/title&gt;
      &lt;link href="Content/bootstrap.css" rel="stylesheet" /&gt;
      &lt;script src="Scripts/jquery-1.9.1.js"&gt;&lt;/script&gt;
      &lt;script src="Scripts/bootstrap.js"&gt;&lt;/script&gt;
      &lt;script src="Scripts/angular.js"&gt;&lt;/script&gt;
      &lt;script src="FrontEnd/BI/Graficos/Compras/Forms/Controllers/ralatorio-compras.js"&gt;&lt;/script&gt;
  &lt;/head&gt;
  &lt;body&gt;
  
      &lt;div class="container" style="padding-top: 100px" ng-app="appCompras"&gt;
          &lt;table class="table table-striped table-bordered"&gt;
              &lt;thead class="table-head center-content"&gt;
                  &lt;tr&gt;
                      &lt;th&gt;Cod. Compra&lt;/th&gt;
                      &lt;th&gt;Cod. Produto&lt;/th&gt;
                      &lt;th&gt;Nome&lt;/th&gt;
                      &lt;th&gt;Quantidade&lt;/th&gt;
                      &lt;th&gt;Data da Compra&lt;/th&gt;
                  &lt;/tr&gt;
              &lt;/thead&gt;
              &lt;tr ng-repeat="compra in names"&gt;
                  &lt;td&gt;{{compra.PkCompras}}&lt;/td&gt;
                  &lt;td&gt;{{compra.IdProduto}}&lt;/td&gt;
                  &lt;td&gt;{{compra.Nome}}&lt;/td&gt;
                  &lt;td&gt;{{compra.Quantidade}}&lt;/td&gt;
                  &lt;td&gt;{{compra.DataCompra}}&lt;/td&gt;
              &lt;/tr&gt;
          &lt;/table&gt;
      &lt;/div&gt;
  
  
      &lt;script&gt;
          var app = angular.module('appCompras', []);
  
          app.controller('comprasCtrl', function ($scope, $http) {
  
              var url = "WebService.asmx\ListarQuinzeCompras";
  
              $http.get(url).success(function (data) {
                  var appJson = JSON.parse(data);
  
                  $scope.names = JSON.parse(appJson);
              })
  
          });
      &lt;/script&gt;
  
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>My WebService:</p>
  
  <pre><code>[WebMethod]
          [ScriptMethod(UseHttpGet = true, ResponseFormat = ResponseFormat.Json)]
          public void ListarQuinzeCompras()
          {
              var SQL = new LibOrgm.SQL();
              var cn = new ADODB.Connection();
  
              try
              {
                  Context.Response.Clear();
                  Context.Response.ContentType = "application/json";
                  SQL.AbrirConexao(cn);
  
                  var retorno = ComprasFO.ListarUltimasQuinzeCompras(cn);
                  Context.Response.Write(SerializerFO.Serializador(retorno));
              }
              catch (Exception Ex)
              {
                  Context.Response.Write(Ex);
              }
              finally
              {
                  SQL.FecharConexao(cn);
              }
          }
  </code></pre>
  
  <p>My class to serialize</p>
  
  <pre><code>using System;
  using System.Collections.Generic;
  using System.IO;
  using System.Linq;
  using System.Runtime.Serialization.Json;
  using System.Text;
  using System.Web;
  
  namespace WebApplication1.CORE
  {
      public class SerializerFO
      {
          public static object DeserializarObjetoJson(string Json, object Objeto)
          {
  
              try
              {
  
                  MemoryStream Stream = new MemoryStream(Encoding.Unicode.GetBytes(Json));
                  DataContractJsonSerializer Desserializador = new DataContractJsonSerializer(Objeto.GetType());
  
                  Objeto = Desserializador.ReadObject(Stream);
  
              }
              catch
              {
                  throw;
              }
              return Objeto;
          }
  
  
          public static string Serializador(object Objeto)
          {
              string Json;
              try
              {
  
                  MemoryStream Stream = new MemoryStream();
                  DataContractJsonSerializer Serializador = new DataContractJsonSerializer(Objeto.GetType());
  
                  Serializador.WriteObject(Stream, Objeto);
  
                  Stream.Position = 0;
                  StreamReader Leitor = new StreamReader(Stream);
  
                  Json = Leitor.ReadToEnd();
  
              }
              catch
              {
                  throw;
              }
  
              return Json;
          }
      }
  }
  </code></pre>
  
  <p>My class:</p>
  
  <pre><code>using ADODB;
  using System;
  using System.Collections.Generic;
  using System.Linq;
  using System.Web;
  using LibOrgm;
  
  namespace WebApplication1.BI.Graficos.Compras
  {
      public class ComprasDA
      {
          public static ComprasBO GetCompras(int PkCompras, Connection cn)
          {
              var Compra = new ComprasBO();
              var RsCompra = new ADODB.Recordset();
              try
              {
                  RsCompra.Open(String.Format("select * from Compras where PkCompras = {0}", PkCompras), cn, CursorTypeEnum.adOpenStatic, LockTypeEnum.adLockReadOnly);
                  if (!RsCompra.EOF )
                  {
                      Compra.PkCompras = int.Parse(RsCompra.Fields["PkCompras"].Value.ToString());
                      Compra.IdProduto = int.Parse(RsCompra.Fields["IdProduto"].Value.ToString());
                      Compra.Nome = RsCompra.Fields["Nome"].Value.ToString();
                      Compra.Quantidade = int.Parse(RsCompra.Fields["Quantidade"].Value.ToString());
                      Compra.DataCompra = DateTime.Parse(RsCompra.Fields["DataCompra"].Value.ToString()); 
                  }
              }
              catch (Exception)
              {
                  throw;
              }
  
              return Compra;
          }
  
  
          public static ComprasBO[] ListUltimos15(Connection cn)
          {
              var RsCompras = new Recordset();
              try
              {
                  RsCompras.Open("SELECT TOP 15 PkCompras FROM Compras ORDER BY PkCompras DESC", cn, CursorTypeEnum.adOpenStatic, LockTypeEnum.adLockReadOnly);
                  if (!RsCompras.EOF)
                  {
                      var ListaCompras = new ComprasBO[RsCompras.RecordCount];
                      for (int i = 0; i &lt; RsCompras.RecordCount; i++)
                      {
                          ListaCompras[i] = GetCompras(int.Parse(RsCompras.Fields[0].Value.ToString()), cn);
                          RsCompras.MoveNext();
                      }
                      RsCompras.Close();
                      return ListaCompras;
                  }
  
              }
              catch (Exception)
              {
                  throw;
              }
              return new ComprasBO[0];
          }
  
      }
  }
  </code></pre>
  
  <p>My Object</p>
  
  <pre><code>using System;
  using System.Collections.Generic;
  using System.Linq;
  using System.Web;
  using ADODB;
  using LibOrgm;
  
  namespace WebApplication1.BI.Graficos.Compras
  {
      public class ComprasBO
      {
          public int PkCompras { get; set; }
          public int IdProduto { get; set; }
          public string Nome { get; set; }
          public int Quantidade { get; set; }
          public DateTime DataCompra { get; set; }
      }
  }
  </code></pre>