Parse JSON with angularJS

Question

Here is my JSON which provides from an API. JSON is correctly generated (with a cat variable attribute url)

{
"api":
  {"version":"1.0",
   "url":"http:\/\/www.example.com",
   "encoding":"UTF-8",
   "generated":"2016-11-28T15:12:18+01:00",
   "contents":"categories_hierarchical"},
"0":{"id":"46",
     "name":"Music",
     "parent_id":"56",
     "event_count":"411",
     "rank":1}
}

First element (api) doesn't need to be displayed. I just want the second (key: 0)

My factory :

.factory('selectedCategoriesService', function($http, $stateParams) {
        var selectedCategories = [];

        return {
        getselectedCategories: function(){
            return $http.get('http://www.myapi.com&data=categorie', { params: { cat: $stateParams.id } }).then(function(response){
                selectedCategories = response.data;
                return response.data;
            });
        },
    getselectedCategorie: function(selectedCategorieId){
        for(i=0;i<selectedCategories.length;i++){
            if(selectedCategories[i].id == selectedCategorieId){
                return selectedCategories[i];
            }
        }
    }
}
})

My controller :

.controller('CategoriesListDetailCtrl',function($scope, $stateParams, selectedCategoriesService){

    var selectedCategorieId = $stateParams.id;
    $scope.selectedCategorie = selectedCategoriesService.getselectedCategorie(selectedCategorieId);

  selectedCategoriesService.getselectedCategories().then(function(selectedCategories){
  $scope.selectedCategories = selectedCategories;
  console.log($scope.selectedCategories);
    })
})

The simple template :

<ion-pane>

  <ion-view view-title="{{selectedCategorie.name}}">

    <ion-content class="has-header">

        <ion-item class="item-thumbnail-left">

           <h2>{{selectedCategories.id}}</h2>

        </ion-item>

    </ion-content>

  </ion-view>

</ion-pane>

lucasnadalutti · Accepted Answer · 2016-11-28 17:26:15Z

1

Just remove the api property from the object then:

selectedCategories = response.data;
delete selectedCategories.api;
return response.data;

By the way, in your template you probably have a typo:

<h2>{{selectedCategories.id}}</h2>

should probably be:

<h2>{{selectedCategorie.id}}</h2>

edited Nov 28, 2016 at 17:26

answered Nov 28, 2016 at 17:15

lucasnadalutti

5,9882 gold badges30 silver badges49 bronze badges

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

3 Comments

bklups Over a year ago

delete selectedCategories; will remove the api property ?

lucasnadalutti Over a year ago

Sorry, my mistake. Updated the answer to fix that line.

bklups Over a year ago

delete selectedCategories.api; works fine but results are not displayed because "0": property, before array, any idea how to resolve ?

Collectives™ on Stack Overflow

Parse JSON with angularJS

1 Answer 1

3 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

3 Comments

Your Answer

Sign up or log in

Post as a guest

Related