Return Json - AngularJs

Question

Return Json - AngularJs

Navigation

#1 by (3 votes)

1

I'm creating an Asp.Net Web.API application and the service return is in Json.

So far so good, it turns out that the main object (Companies) is returning an internal object - citiesFiliais (Branches by City) with a Bracket that is not interpreted correctly by View.

In the View I already did a test including the object manually in the page without the inclusion of "[]" and in this way when invoking {{company.cidesfiliais.city}} > the name of each City is displayed without any problem. But by invoking the Json directly from the BackEnd the records for the citiesFiliais object are not displayed on the screen.

I know the only problem is the internal "[]" as mentioned before, the question is, how do I make the return of the BackEnd equal to the 2nd example shown below?

1st Example - Current JSON form:

{ "company": "Industry Reunidas", "PrimaryPhone": "3030-9999", "citiesFiliais": [ { "city": "Belo Horizonte", "status": "MG", "ddd": 31 }, { "city": "Savior", "status": "BA", "ddd": 71 }, { "Sao Paulo city", "status": "SP", "ddd": 11 } ] }

Example 2 - How JSON should be generated:

{ "company": "Industry Reunidas", "PrimaryPhone": "3030-9999", "citiesFiliais": { "city": "Belo Horizonte", "status": "MG", "ddd": 31 }, { "city": "Savior", "status": "BA", "ddd": 71 }, { "Sao Paulo city", "status": "SP", "ddd": 11 } }

Thanks for the force !!!

angularjs asp.net asp.net-web-api

asked by anonymous 25.10.2016 / 19:57

1 answer

Installing IOS application without having to go into the store Is it possible to shorten the path of the .h files included by the .pri file?

score 3 · Accepted Answer

Your second example JSON is invalid. Use a parser as the link to test it.

The two standards in use are as follows:

Property: {"chave": "valor"}
Collection: ["valor1", "valor2", "valor3"]

Your second example tries to implement an object where properties have no key, just value.

Alternatively you can create placeholder keys using the index:

{
  "empresa": "Industria Reunidas",
  "fonePrincipal": "3030-9999",
  "cidadesFiliais": {
    "0": {
      "cidade": "Belo Horizonte",
      "estado": "MG",
      "ddd": 31
    },
    "1": {
      "cidade": "Salvador",
      "estado": "BA",
      "ddd": 71
    },
    "2": {
      "cidade": "São Paulo",
      "estado": "SP",
      "ddd": 11
    }
  }
}

Note that this causes the CidadesFiliais property to no longer describe a collection, but rather an object ondes the 0 , 1 , and 2 properties is an object.

On most models this is not recommended. The first format is correct. My suggestion would be to change your view, and instead of using the (chave, valor) in colecao format in your ng-repeat use item in colecao , as in the example below:

angular.module('myApp', [])
.controller('myController', function($scope){

  $scope.valor = {
    "empresa":"Industria Reunidas",
    "fonePrincipal":"3030-9999",
    "cidadesFiliais":[
      {
        "cidade":"Belo Horizonte",
        "estado":"MG",
        "ddd":31
      },
      {
        "cidade":"Salvador",
        "estado":"BA",
        "ddd":71
      },
      {
        "cidade":"São Paulo",
        "estado":"SP",
        "ddd":11
      }
    ]
  }
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.8/angular.js"></script><divng-app="myApp">
  <div ng-controller='myController'>

    {{valor.empresa}}<br/><br/>

    <table>
      <tr>
        <th>UF</th>
        <th>Nome</th>
      </tr>
      <tr ng-repeat='i in valor.cidadesFiliais'>
        <td>{{i.estado}}</td>
        <td>{{i.cidade}}</td>
      </tr>
    </table>
  </div>
</div>