How to do ng-repeat query with various arrays?

Question

I have a blog and I need to get the url of the images of each post. Only they are inside the arrays and I’m not getting.

The image illustrates the way. Someone can help me ?

The red dots show. I have 3 posts and on the post1 I have 9 images attached.

Thanks for all your help.

Answer 1

First you must create an ng-repeat to pick up the posts, within this ng-repeat you must create another to pick up the attachments with the url’s, follow the example below:

var myApp = angular.module('myApp', []);

myApp.controller('MyController', function($scope){
  
  
  $scope.meuObjeto = {count: 3, pages: 1, posts:
                      [{ attachments: 
                          [
                            {
                              id: 1,
                              caption: 'Teste caption',
                              description: 'Teste description',
                              url: 'http://www.stackoverflow.com/'
                            },
                            {
                              id: 2,
                              caption: 'Teste caption 1',
                              description: 'Teste description1',
                              url: '/'
                            }
                          ],
                        outroAtributo : 'Teste outro atributo'
                        
                      },
                      { attachments: 
                          [
                            {
                              id: 3,
                              caption: 'Teste caption2',
                              description: 'Teste description2',
                              url: 'http://www.google.com/'
                            }
                          ],
                        outroAtributo : 'Teste outro atributo'
                        
                      },
                      ]
                     };
              
  
  
});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>

<div ng-app="myApp" ng-controller="MyController">
  <ul>
    <li ng-repeat="post in meuObjeto.posts track by $index">
      {{$index}}
      <ul>
        <li ng-repeat="att in post.attachments track by att.id">{{att.url}}</li>
      </ul>
    </li>
  <ul>
</div>