How do I get data from a server for each element in an array in AngularJs

Question

Let us consider I have an array:

    var friendRequests=[
      {
      id:"Xyz",
      requester:"person 1"
      },
      {
      id:"Xyz2",
      requester:"person 2"
      }]

this array iterates in the template using ng-repeat="friendRequest in friendRequests". Meanwhile I want to grab the profile of each requester to show it with each friendrequest in ng-repeat. I am new to angular so I can't figure that out.

Answer 1

If i get your question right it is quite simple:

<ul>
    <li ng-repeat="friendRequest in friendRequests">{{friendRequest.requester }}</li>
</ul>

in each iteration the scope would be the object you defined (in this case friendRequest) and you can access its attributes like any javascript object.

UPDATE:

So i understand you wish to get the profile for each user and display it, what you need to do is to change the server response to include the profile for each user so it will look something like this:

    var friendRequests=[
      {
      id:"Xyz",
      requester:"person 1",
      profile: {name: 'user1 name' , avatar: 'http://some/url'}
      },
      {
      id:"Xyz2",
      requester:"person 2",
      profile: {name: 'user2 name', avatar: 'http://some/url'}
      }]

Then to display it:

     <ul>
        <li ng-repeat="friendRequest in friendRequests">
           <span>{{friendRequest.requester}}</span>
           <span>{{friendRequest.profile.name}}</span>
       </li>
    </ul>