I can’t get the value of an object inside an ARRAY

Question

I am developing an application to read a wordpress base. I have many posts that are separated by category.

I’ve been able to show the categories in the view but when I select a specific category it shows all the photos from all categories.

I am attaching two images to better explain the console.

The first search was simple because it was picked up by the JSON API by the categories but when I click on one I’m lost. It follows the codes.

I really need your help. I work with children with ALS (Lateral Amyotrophic Exclerosis). This project has the function of uniting people with this problem.

Code that takes categories and list:

<blink> 
    $ionicLoading.show({template: 'Carregando...', duration: 3000});
    $http.get('localhost/app/api/get_tag_posts/…{ 
        $scope.lista = data; 
        console.log(data); 
        $ionicLoading.hide(); 
    }).error(function(erro){ 
        console.log(erro); 
        $ionicLoading.hide(); 
    }); 
</blink>

Then I’ll take a div and show you:

<div class="card" ng-repeat="pega in lista.posts"> </BR> 
    <a href="#/app/search" ng-click="obras($index)">
        <img src="{{pega.thumbnail}}" width="300" height="200"> 
    </a> 
    <h4> {{pega.title}} </h4> 
</div>

Here’s the problem, because when I choose the category I have to take the images inside this research and it’s showing me everything:

<div class="card" ng-repeat="pega in lista.posts"> 
    <div ng-repeat="pega2 in pega.attachments"> 
        <div class="Item item-text-wrap"> 
            <img src="{{pega2.url}}" width="100%"> <p></p> 
            <a class="button button-small button-outline button-positive" ng-click="Compartilhar($index)">Compartilhar...</a> <p></p> </br> 
        </div> 
    </div> 
</div>