How to display data from a json file in angularjs?

Question

I have a json something like this

{
 "count": 67,
 "0": {
    "id": "2443",
    "name": "Art Gallery",
    "category": {
        "id": "2246",
        "name": "Gifts & Memories"
    },
   "deckLocation": [
      {
        "id": "2443",
        "deck": {
          "deckNo": "7",
          "deckName": "Promenade "
        },

      }
    ]
},
"1": {
  "id": "7198",
  "name": "Captain's Circle Desk",
  "category": {
    "id": "352",
    "name": "Other Services"
  },
  "deckLocation": [
    {
      "id": "7198",
      "deck": {
        "deckNo": "7",
        "deckName": "Promenade "
      },

    },
    {
      "id": "7198",
      "deck": {
        "deckNo": "7",
        "deckName": "Promenade "
      },

    }
   ]
 }
}

I want to display all names which is inside the "0", "1" array. I can able to list a specific name but not all. The fist name will display which I written in the following code. But I need to display all 0, 1, 2, 3 etc names dynamically.

data[0].name

Please help me. Thank you.

krunal nanda · Accepted Answer · 2015-02-04 08:23:11Z

4

use ng-repeat function to do so.

<div ng-repeat = "names in data">
<P>{{names.name}}</P>
</div>

answered Feb 4, 2015 at 8:23

krunal nanda

2351 silver badge12 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

amitthk · Accepted Answer · 2015-02-04 08:43:23Z

Let us say you have a service like this:-

    var todoApp = angular.module("todoApp",[]);

    todoApp.factory('dbService', ['$q','$http',function ($q , $http) {  
    var service ={};
        service.getUrl = function (urlToGet) {
            var svc=this;

            var deferred = $q.defer();
            var responsePromise = $http.get(urlToGet);

            responsePromise.success(function (data, status, headers, config) { 
                deferred.resolve(data);  });

            responsePromise.error(function (data, status, headers, config) { 
                deferred.reject({ error: "Ajax Failed", errorInfo: data });});

            return (deferred.promise);
        }
        return service;
        }]);

And you want to load a file named '/js/udata.json'. Here is how in you controller you can load this file:-

todoApp.controller("ToDoCtrl", ['$scope','$timeout','dbService',function($scope, $timeout, dbService)
{
    $scope.todo={};

  $timeout(function(){
   dbService.getUrl('/js/udata.json').then(function(resp){
    $scope.todo=resp;
   });},1);
};

Hope this helps!

Mohanavel T · Accepted Answer · 2016-09-22 06:43:51Z

0

You have data[0].name right?

then why don't you loop through that to get all the name elements in those arrays.

like...

for(i=1;i<data.length;i++)
{
console.log(data[i].name);
}

answered Sep 22, 2016 at 6:43

Mohanavel T

3914 silver badges18 bronze badges

Collectives™ on Stack Overflow

How to display data from a json file in angularjs?

3 Answers 3

Comments

Comments

Comments

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

Comments

Linked

Related